CSS_Kaskadowe_arkusze_stylow_Przewodnik_encyklopedyczny_Wydanie_III_kasty3.pdf

(2922 KB) Pobierz
CSS. Kaskadowe arkusze
stylów. Przewodnik
encyklopedyczny.
Wydanie III
Autor: Eric A. Meyer
T³umaczenie: Anna Trojan
ISBN: 978-83-246-0956-7
Tytu³ orygina³u:
CSS: The Definitive Guide
Format: B5, stron: 528
Kompendium wiedzy o kaskadowych arkuszach stylów
Opis struktury arkusza stylów
Sposoby definiowania charakterystyk czcionek
Tworzenie efektownych interfejsów u¿ytkownika
Pozycjonowanie elementów
Kaskadowe arkusze stylów (CSS), to technologia, która zrewolucjonizowa³a proces tworzenia
witryn internetowych. Projektanci stron WWW dostali do rêki potê¿ne narzêdzie pozwalaj¹ce
na definiowanie wygl¹du tekstu, tabel, ramek, ³¹czy i innych elementów dokumentu za
pomoc¹ prostych parametrów zamieszczonych w odrêbnym pliku lub wydzielonym miejscu
kodu strony. Dziêki arkuszom stylów mo¿liwe jest ca³kowite rozdzielenie procesu edycji treœci
strony od okreœlania jej aspektów typograficznych i kolorystycznych, co niezwykle u³atwia
dostosowanie serwisu WWW do przegl¹dania na ró¿nych urz¹dzeniach – monitorach
komputerów, wyœwietlaczach telefonów komórkowych i terminali Blackberry.
Ksi¹¿ka
„CSS.
Kaskadowe arkusze stylów. Przewodnik encyklopedyczny. Wydanie III” to
kompleksowe Ÿród³o informacji o wszystkich aspektach stosowania kaskadowych arkuszy
stylów zgodnie z najnowszymi specyfikacjami konsorcjum W3C – CSS2 oraz CSS2.1.
Czytaj¹c j¹, dowiesz siê, jak definiowaæ style dla tekstu, formatowaæ tabele i tworzyæ
funkcjonalne interfejsy u¿ytkownika. Poznasz ró¿nice pomiêdzy elementami p³ywaj¹cymi
i pozycjonowanymi, zasady stosowania jednostek miar w definicjach stylów oraz metody
przystosowywania treœci i uk³adu strony do druku czy odczytywania przez oprogramowanie
u³atwiaj¹ce korzystanie z sieci osobom niepe³nosprawnym. Znajdziesz tu tak¿e informacje
o tym, które elementy specyfikacji CSS s¹ obs³ugiwane przez przegl¹darki obecne dziœ
na rynku.
£¹czenie stylów z dokumentami XHTML
Stosowanie selektorów
Struktura definicji stylów
Jednostki miary stosowane w definicjach stylów
Korzystanie z ró¿nych krojów czcionek
Formatowanie tekstu
Marginesy i obramowania
Kolory
Pozycjonowanie elementów
Korzystanie z tabel
Definiowanie stylów dla mediów nieekranowych
Wykorzystaj doœwiadczenie Erica Meyera i poznaj wszystkie aspekty stosowania CSS
Wydawnictwo Helion
ul. Koœciuszki 1c
44-100 Gliwice
tel. 032 230 98 63
e-mail: helion@helion.pl
Spis treści
Przedmowa ....................................................................................................................9
1. CSS i dokumenty .......................................................................................................... 15
Upadek Internetu
CSS przychodzi na ratunek
Elementy
Łączenie
CSS i XHTML
Podsumowanie
15
17
21
25
35
2. Selektory ...................................................................................................................... 37
Podstawowe reguły
Grupowanie
Selektory klas oraz identyfikatorów
Selektory atrybutów
Wykorzystywanie struktury dokumentu
Pseudoklasy oraz pseudoelementy
Podsumowanie
37
41
45
51
56
63
72
3. Struktura oraz kaskada ............................................................................................... 73
Specyficzność
Dziedziczenie
Kaskada
Podsumowanie
73
78
81
86
4. Wartości oraz jednostki ............................................................................................... 87
Wartości liczbowe
Wartości procentowe
Kolory
Jednostki długości
Adresy URL
87
87
88
93
99
5
Jednostki CSS2
Podsumowanie
101
102
5. Czcionki ...................................................................................................................... 103
Rodziny czcionek
Waga czcionki
Rozmiar czcionki
Style i warianty
Rozciąganie i dostosowywanie czcionki
Właściwość font
Dobieranie czcionek
Podsumowanie
104
108
114
121
125
127
132
134
6. Właściwości tekstu .....................................................................................................137
Wcięcia oraz wyrównanie poziome
Wyrównanie w pionie
Odstępy pomiędzy słowami oraz literami
Transformacja tekstu
Dekoracja tekstu
Cień tekstu
Obsługa białych znaków
Kierunek tekstu
Podsumowanie
137
142
151
154
156
160
161
163
165
7. Podstawowe formatowanie wizualne ..................................................................... 167
Podstawowe pojemniki
Elementy blokowe
Elementy wewnętrzne
Zmiana wyświetlania elementu
Podsumowanie
167
170
188
207
214
8. Dopełnienie, obramowanie oraz marginesy ............................................................ 215
Podstawowe pojemniki elementów
Marginesy
Obramowanie
Dopełnienie
Podsumowanie
215
219
231
245
251
9. Kolory i tła ..................................................................................................................253
Kolory
Kolory pierwszego planu
Tło
Podsumowanie
6
|
Spis treści
253
254
260
287
10. Pływanie oraz pozycjonowanie ................................................................................289
Pływanie
Pozycjonowanie
Podsumowanie
289
307
342
11. Układ tabel .................................................................................................................343
Formatowanie tabel
Obramowanie komórek tabeli
Rozmiar tabeli
Podsumowanie
343
355
363
372
12. Listy oraz zawartość generowana ............................................................................ 373
Listy
Zawartość generowana
Podsumowanie
373
381
395
13. Style interfejsu użytkownika .................................................................................... 397
Czcionki oraz kolory systemowe
Kursory
Obrysy
Podsumowanie
397
402
406
412
14. Media nieekranowe ................................................................................................... 413
Przydzielanie arkuszy stylów dla określonego medium
Media stronicowe
Style dźwiękowe
Podsumowanie
413
414
431
448
A Przewodnik po właściwościach ............................................................................... 449
B Selektory, pseudoklasy oraz pseudoelementy .........................................................493
C Przykładowy arkusz stylów HTML 4 ......................................................................... 501
Skorowidz .................................................................................................................505
Spis treści
|
7
ROZDZIAŁ 10.
Pływanie oraz pozycjonowanie
CSS rzeczywiście umożliwia atrakcyjny wygląd zawartości dokumentu dzięki zmianom czcio-
nek, tła i pozostałych elementów, jednak jak można osiągnąć podstawowe możliwości wpły-
wające na układ elementów? Dzieje się to dzięki
pływaniu
(ang.
floating)
oraz
pozycjonowaniu
(ang.
positioning).
Są to narzędzia, które pozwalają uzyskać układ kolumnowy, nakładać jeden
fragment dokumentu na drugi i, ogólnie mówiąc, otrzymać wszystko to, do czego przez długie
lata wykorzystywane były ogromne ilości tabel.
Idea przyświecająca pozycjonowaniu jest względnie prosta. Pozycjonowanie pozwala dokładnie
określić, w którym miejscu powinien znajdować się pojemnik elementu w stosunku do miej-
sca, w jakim normalnie by się pojawił — lub w stosunku do elementu rodzica, innego ele-
mentu albo nawet względem samego okna przeglądarki. Możliwości tej cechy są jednocześnie
i oczywiste, i zaskakujące. Nie będzie zaskakującą wiadomością to,
że
przeglądarki imple-
mentują ten element CSS2 o wiele lepiej od innych.
Z kolei pływanie pojawiło się już w CSS1 — w oparciu o możliwość dodaną przez Netscape
we wczesnych latach istnienia Internetu. Pływanie nie jest dokładnie pozycjonowaniem, jednak
z pewnością nie należy również do standardowego, normalnego układu. W dalszej części ni-
niejszego rozdziału zostanie wytłumaczone, na czym ono dokładnie polega.
Pływanie
Koncepcja elementów pływających (ang.
floated elements)
jest z pewnością znana. Już od czasu
Netscape 1 możliwe było zadeklarowanie — na przykład —
<img src="b5.gif" align="right">
w celu uzyskania pływających obrazków. Powodowało to,
że
obrazek „spływał” na prawą
stronę i pozwalał na to, by inna treść (taka jak tekst) „opływała” go. Nazwa „pływanie” po-
chodzi zresztą z dokumentu
Extensions to HTML 2.0,
w którym napisano:
Dodatki do opcji
ALIGN
wymagają dużej dozy wyjaśnień. Na początek — wartości „left”
oraz „right”. Obrazki z takim wyrównaniem stanowią zupełnie nowy,
pływający
typ obrazków.
W przeszłości możliwe było jedynie uzyskanie pływających obrazków oraz w niektórych
przeglądarkach również tabel. CSS z kolei pozwala na to w przypadku dowolnego elementu,
od obrazków i akapitów aż po listy. W CSS takie zachowanie można uzyskać dzięki właści-
wości
float
.
289
Zgłoś jeśli naruszono regulamin