W tym artykule opowiem trochę o wszystkich poleceniach CSS, które nazwałem “egzotycznymi”. Egzotycznymi, to znaczy takimi, których nie będziesz zapewne używał na co dzień albo takimi, których nie interpretuje żadna przeglądarka.
@import
Jest to odwołanie się do zewnętrznego arkusza stylu (przypominam – rozszerzenie *.css!) znajdującego się na obcej witrynie. Teoretycznie podobne w działaniu do zwykłego zewnętrznego pliku CSS, do którego odwołujemy się za pomocą <link rel=”stylesheet” href=”nazwa_pliku.css” type=”text/css”>, ale praktycznie o wiele gorsze. Różnica polega na tym, że nie odwołujemy się do arkusza, który tworzymy sami i modyfikujemy według własnych potrzeb. Arkusz znajdujący się na innej witrynie (a więc tworzony przez innego webmastera), może być w każdej chwili (i bez naszej wiedzy) zmieniony, psując tym samym cały wygląd naszej strony. Stosowanie tego polecenia ma sens chyba tylko wtedy, kiedy nie tworzymy swojej strony, tylko np. robimy dział do innej witryny i wtedy wskazane jest aby ta strona była formatowana zgodnie z witryną, dla której robimy dział. Polecenie @import stosujemy w ten sposób:
| <style> <!– @import url(“adres_arkusza.css”); –> </style> |
Odstępy pomiędzy wyrazami
Ciekawą możliwością, jaką oferują style, jest ustalenie odstępów pomiędzy wyrazami. Skoro jednak piszę o tym w tym akurat artykule, oznacza to, że niestety nie da się zastosować odstępów między wyrazami. Żadna przeglądarka nie interpretuje definicji tych odstępów. Kto wie, być może w chwili kiedy czytasz te słowa, przeglądarki już obsługują to polecenie… Pokażę jednak, jak zdefiniowaźć odstępy między wyrazami. Aha: odstępy zawsze definiujemy w jednostkach miary (np. cm, in itp.)
| <p style=”word-spacing:2cm”>2 centymetrowe odstępy między wyrazami</p> |
color:background
Definiując kolory (np. red czy #FFFFFF) poleceniem “color” możemy skorzystać z bardzo ciekawej możliwości, jaką oferują nam style, aczkolwiek rzadko stosowanej w serwisach internetowych. Mowa tu o “kolorze” background. Zamiast pisać np. color:green; (kolor zielony), możemy napisać color:background;. Uzyskany kolor będzie tym kolorem, który czytelnik naszej strony ma na swoim pulpicie. Szczerze mówiąc nie wiem, gdzie polecenie to może znaleźć zastosowanie… Jeśli czytelnik ma ustawiony kolor biały, a tło witryny jest tego samego koloru? Wtedy nie zobaczy tekstu… Ten “kolor” background jest jednym z 28 kolorów systemowych wprowadzonych w CSS2. Background jest tylko jednym z nich – poza nim są jeszcze np. “inactiveborder”, “buttontext”, “window” itp. Kolory te są różne, w zależności od tego, jaki schemat Windows czytelnik ma ustawiony… No dobrze zobaczmy teraz kod:
| <p style=”color:background”>ten tekst jest wyświetlany takim kolorem, jaki czytelnik strony ma na swoim pulpicie!</p> |
Obrys
Bardzo ciekawym poleceniem wydaje się być Obrys. Niestety – póki co, żadna przeglądarka nie obsługuje obrysów. No dobrze, ale co to jest ten obrys? Jest to coś podobnego do obramowania, ale różniące się od niego. Obrys nie musi być prostokątem, jest tworzony na elemencie, a nie poza nim, wreszcie nie da się ustalić oddzielnych cech dla każdego z boków obrysu. Obrys przydatny może być np. wtedy, gdy chcemy zrobić ładnie wyglądające obramowanie na grafice. Możemy zdefiniować kolor obrysu, styl obrysu i jego szerokość.
| <img src=”grafika.jpg” style=”outline-color:kolor obrysu”> <img src=”grafika.jpg” style=”outline-style:styl obrysu”> <img src=”grafika.jpg” style=”outline-width:szerokość obrysu”> |
Media
Choć CSS służy głównie do formatowania stron www, to może być też wykorzystane np. do stworzenia innej wersji dokumentu do drukarki czy nawet… syntezatora mowy. O ile tworzenie trochę innego stylu do prezentacji dokumentu na ekranie, a innego na drukarce ma sens (być może, niedługo napiszę coś więcej na temat tworzenia innej wersji strony na potrzeby drukarki), to nie sądze, aby dzisiejszemu webmasterowi, nie tworzącemu strony Białego Domu, przydało się do czegoś zrobienie innej wersji strony np. dla syntezatora mowy czy dla drukarki braila! Skoro jednak rozpocząłem temat, to wymienię wszystkie dostępne na razie typy mediów:
|
