warto - Kurs HTML i CSS
Marginesy CSS / Wymiarowanie pudełka {box-sizing}...dawnego sposobu interpretacji, aby nadal prezentowały się poprawnie. Warto zauważyć, że przy wymiarowaniu "border-box" miejsce na faktyczną zawartość treści w elemencie kurczy się w miarę dodawania marginesów wewnętrznych oraz obramowania. Może się zdarzyć zatem, że na właściwą zawartość w ogóle już nie wystarczy miejsca. Nie jest możliwe natomiast, aby właściwa zawartość treści elementu miała wartość ujemną. Używanie deklaracji "box-sizing: border-box" na nowych stronach raczej nie...
- Obramowanie CSS / Nawis obramowania obrazkowego {border-image-outset}
...Selektorem może być praktycznie dowolny znacznik, np. p - akapit czy h1 - tytuł [zobacz: Wstawianie stylów]. Natomiast jako "nawis" należy podać wartość szerokości wystającej poza krawędź tradycyjnego obramowania, wyrażoną w jednostkach długości lub jako liczba naturalna (podająca wielokrotność szerokości obramowania). Możliwe jest przy tym podanie: jednej wartości - określa jednakową szerokość nawisu poza wszystkie krawędzie obramowania dwóch wartości - pierwsza określa szerokość...
- Selektory specjalne CSS / Klasy selektorów <... class>
Spis treści <... class> Klasy selektorów <... class> Lista klas Podzbiory klas Klasy selektorów <... class> selektor.klasa { cecha: wartość } Selektorem może być dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli i inne) [zobacz: Wstawianie stylów]. Klasa to wartość atrybutu class="..." nadanego selektorowi z poziomu języka HTML. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Jako...
- Selektory pseudoklas CSS / Łączenie selektorów
Na koniec warto wspomnieć o jeszcze jednej przydatnej własności selektorów CSS. Jak się można było przekonać, rodzajów selektorów jest bardzo wiele - każdy przeznaczony do innego celu. Co jednak zrobić, jeżeli potrzebujemy w jednej regule stylu zastosować kilka selektorów prostych? Czy jest to w ogóle możliwe? Oczywiście, że tak. Wystarczy po prostu wpisać je jeden po drugim (bez żadnych odstępów) w następującej kolejności: selektor typu lub selektor uniwersalny selektory atrybutów...
- Układ wielokolumnowy CSS / Odstęp kolumn {column-gap}
...{ column-gap: szerokość } Szerokość jest wyrażona w jednostkach długości i nie może być mniejsza od zera. Aby wymusić domyślny odstęp, należy podać wartość normal. Sąsiadujące kolumny z tekstem nie powinny do siebie bezpośrednio przylegać, gdyż wywołałoby to zlewanie się tekstu na krawędzi kolumn. Temu nieprzyjemnemu efektowi może skutecznie zapobiegać przerwa między kolumnami. Warto mieć na uwadze, że wartość domyślna tego odstępu (normal) zależy od konkretnej przeglądarki i wcale nie musi...
- Tekst CSS / Tryb pisania {writing-mode}
...może się przydać takie nienaturalne ułożenie tekstu w pionie. Na przykład wyobraźmy sobie tabelę z wieloma kolumnami, w których znajdują się krótkie wartości - np. małe liczby całkowite. Jeśli do takiej tabeli dodamy nagłówek, może okazać się, że tabela stanie się bardzo szeroka, przez co trudno będzie ją czytać. W takiej sytuacji czasami lepiej jest wpisać komórki nagłówkowe pionowo, dzięki czemu cała tabela przyjmie bardziej zwarte rozmiary. Warto pamiętać, że nawet w przypadku pionowego...
- Tło CSS / Atrybuty mieszane tła {background}
...atrybuty mieszane Atrybuty mieszane tła {background} (interpretuje Internet Explorer 6, Firefox, Opera, Chrome) selektor { background: wartości atrybutów } Selektorem może być praktycznie dowolny znacznik, np. p - akapit, h1 - tytuł czy td - komórka tabeli [zobacz: Wstawianie stylów]. Natomiast jako "wartości atrybutów" należy wpisać konkretne wartości atrybutów, dotyczących tła, które będą oddzielone od siebie spacjami (przy czym można niektóre pominąć). Są to: kolor tła...
- Wykazy CSS / Odstęp wyróżnika wykazu {marker-offset}
Spis treści {marker-offset} Odstęp wyróżnika wykazu {marker-offset} Wyróżnik obrazkowy w tle Odstęp wyróżnika wykazu {marker-offset} (nieinterpretowane) selektor { marker-offset: odstęp } Selektorem może być element z ustalonym wyświetlaniem typu marker [zobacz: Wstawianie stylów]. Natomiast "odstęp" oznacza odległość wyróżnika wykazu (markera) od tekstu, znajdującego się w poszczególny punktach. Wartość odstępu należy podać używając jednostek długości. Polecenie to pozwala nam w...
- CSS dla zielonych / Wstawienie arkusza stylów CSS <link "stylesheet">
...oraz </head> - jedną dodatkową linijkę: <!doctype html> <html> <head> <meta charset="utf-8"> <meta name="description" content="Tu wpisz opis zawartości strony"> <title>Tu wpisz tytuł strony</title> <link rel="stylesheet" href="style.css"> </head> <body> Tu wpisuje się treść strony </body> </html> Dzięki znacznikowi <link> do dokumentu zostanie automatycznie dołączony arkusz stylów. W nim właśnie wpisuje się wszystkie polecenia zmieniające wygląd strony. Ważne jest tylko, aby ten...
- Rozmiary CSS / Przepełnienie tekstu {text-overflow}
...długi może być tekst na stronie - bo powstanie on dopiero później - dlatego aby zabezpieczyć się na taką okoliczność, zwykle ukrywa się nadmiarową zawartość przy pomocy stylu "overflow: hidden" albo "overflow: auto". Kłopot w tym, że wtedy użytkownik może się w ogóle nie zorientować, że tekst został przycięty - zwłaszcza jeśli litery ułożą się w taki sposób, że żaden wyraz nie zostanie ucięty w środku. W takiej sytuacji znacznie lepiej by było wstawić na końcu wiersza wielokropek, który...