Kurs CSS 2.1. Budujemy nowoczesne i stylowe witryny

U swych korzeni Internet miał służyć jedynie przekazywaniu porcji informacji. Oczywiście założenie to jest nadal prawdziwe, lecz w miarę rozwoju infrastruktury technicznej oraz dynamicznego poszerzania się grona użytkowników Sieci zaczęto przywiązywać odpowiednią wagę do sposobu prezentowania danych – do stylu dokumentu i form jego interakcji z użytkownikiem.

Początkowo formatowaniu treści służyły opisujące ją znaczniki HTML. W ten sposób stosowano określoną typografię, np. dzielono fragmenty tekstu na kolumny. Wiele z wykształconych w tej epoce metod znajduje zastosowanie (lub może raczej "pokutuje") do dziś – jak na przykład powszechne użycie znacznika <table>. W połowie lat dziewięćdziesiątych ubiegłego stulecia wzrost liczby stron internetowych i objętości publikowanych na nich treści wymusił jednak zmianę podejścia do zagadnień stylu. Konieczne stało się zastosowanie narzędzia, które poprzez oddzielenie treści od jej formy pozwoli efektywnie zarządzać sposobem prezentacji informacji na wielu stronach internetowych jednocześnie w sposób ujednolicony i wydajny. W ramach nowo powstałego World Wide Web Consortium (W3C) – organizacji mającej odtąd wyznaczać standardy rozwoju globalnej sieci – podjęto prace nad stworzeniem uniwersalnego języka opisu stylu dokumentu.

W rezultacie w grudniu 1996 roku ogłoszono specyfikację CSS w wersji 1.0. Bogaty zestaw reguł pozwalał w sposób daleko bardziej zaawansowany ingerować w sposób, w jaki przeglądarka będzie prezentowała dane. Układ tekstu został podporządkowany podstawowej jednostce – modelowi pudełka (box). Jego dowolnie skomplikowane kombinacje można obecnie wykorzystywać w tworzeniu warstwy graficznej strony, określając pozycję, odstępy, kolory i wzajemne zależności. Sam tekst może być także w niezwykle elastyczny sposób kontrolowany zarówno pod względem kroju, koloru, odstępów oraz marginesów, jak i w bardziej skomplikowanych układach. Po pewnym czasie poszerzono możliwości języka, tworząc standard CSS w wersjach 2.0 i 2.1. Jakkolwiek druga z tych specyfikacji nie została wciąż oficjalnie zarekomendowana, to zakres jej upowszechnienia czyni z niej de facto wyznacznik obecnie obowiązujących zasad projektowania. W przygotowaniu jest już standard CSS 3.0. Choć niektóre z jego właściwości zostały już na zasadach prototypu zaimplementowane w części programów, to moment ostatecznego wdrożenia wciąż jest nieznany.

Mimo upływu czasu i statusu standardu specyfikacja CSS 2.1 nie została nadal w całości "przyswojona" przez najbardziej liczące się przeglądarki. Prym wiedzie tutaj Internet Explorer, który nawet w najnowszej wersji nie zawiera pełnej implementacji CSS 2.1, ale nie jest on wyjątkiem. W takiej sytuacji webdesignerowi pozostaje skupienie się na elementach obsługiwanych przez jak największą liczbę programów. Co prawda ogranicza to możliwości twórcze, ale pozwala zapewnić wszystkim użytkownikom bezproblemowe korzystanie z finalnego dzieła. Zgodnie z tym podejściem w poniższym tekście uwzględniono jedynie te funkcje CSS 2.1, które są obecnie obsługiwane przez większość przeglądarek.

Spis treści:

1. Wprowadzenie

2. Struktura arkusza stylów (czytaj)

2.1. Podstawy składni
2.2. Rodzaje selektorów
2.3. Pseudoelementy i pseudoklasy
2.4. Rodzaje wartości i jednostki
2.5. Klauzula !important
2.6. @-reguły
2.7. Dziedziczenie
2.8. Przykład nr 1

3. Wyświetlanie elementów (czytaj)

3.1. Model pudełka
3.2. Wymiary
3.3. Dopełnienie
3.4. Ramka
3.5. Marginesy
3.6. Przykład nr 2

4. Pozycjonowanie elementów (czytaj)

4.1. Rodzaje elementów
4.2. Rodzaje pozycjonowania
4.3. Opływanie
4.4. Sortowanie stosu
4.5. Nadmiar treści
4.6. Przycinanie
4.7. Widoczność
4.8. Przykład nr 3

5. Formatowanie tekstu (czytaj)

5.1. Rodzaj czcionki
5.2. Waga czcionki
5.3. Kolor, styl i wariant czcionki
5.4. Tekst
5.5. Przykład nr 4

6. Formatowanie list (czytaj)

6.1. Definiowanie markerów
6.2. Przykład nr 5

7. Formatowanie tła (czytaj)

7.1. Wypełnienie kolorem
7.2. Wypełnienie obrazem
7.3. Przykład nr 6

8. Elementy interfejsu (czytaj)

8.1. Kolory
8.2. Czcionki
8.3. Kursory

9. Podsumowanie (czytaj)

«poprzednia 1 2 3 4 ... 9 następna »

Podoba Ci się ten tekst? Powiedz o tym innym na Fb: lub na G+:

publikuj:

wydrukuj

5 skomentuj »

Komentarze

#1 qarola 2010-07-07 17:44:58 0
drobna literówka w przykładzie 1 - zamiast

powinno być

:)
IP: 188.147.83.[...] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/533.4 (KHTML, like Gecko) Chrome/5.0.375.99 Safari/533.4
#2 qarola 2010-07-07 17:46:17 0
no tak... :p

zamiast 'h2' powinno być '/h1' :)
IP: 188.147.83.[...] Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US) AppleWebKit/533.4 (KHTML, like Gecko) Chrome/5.0.375.99 Safari/533.4
#3 ja_gupa 2010-08-05 13:04:52 0
no i przyszło mi się nauczyć css :P a już było tak miło jak sie zmusiłam to Latex`a i przebrnęłam przez skład pierwszych książek, a tu znowu coś potrzebnego do pracy... w jaskini to mieli prościej :P
IP: 213.108.11.[...] Mozilla/5.0 (Windows; U; Windows NT 5.1; pl; rv:1.9.1.2) Gecko/20090729 Firefox/3.5.2 (.NET CLR 3.5.30729)
#4 sprawdzenie strony 2011-03-29 22:00:23 -1
index:

Strona o FC BARCELONA

STRONA O FC BARCELONIE

Witamy na stronie o klubie piłkarskim FC BARCELONA

HISTORIA:

Pod koniec 1899 roku Hans Gamper wraz z inymi entuzjastami uprawaili

nieznany dot±d sport zwany "foot-ball" ( piłka nożna ) . Kiedy 29

listopada 1899 Gamper założył nowy klub - Barcelona Football Club nie mógł

przypuszczać jak wielki wpływ wniesie ta nazwa do historii piłki nożnej

nie tylko Europy, ale i całego ¦wiata ! Przez następne kilka lat Barcelona

kojarzona przez Katalończyków jako symbol nadzieji na wolno¶, co utrwaliło

się do dzisiaj . Przez blisko 100 lat Barcelona do¶wiadczyła momentów

zarówno wielkiej chwały jak i tragedii, czasów wielkich zwycięstw i

porażek. Wiele z tych momentów sprawiło, zę Barcelona jest do dzi¶ dnia

naprawdę unikalnym zespołem i jednym z najbardziej udekorowanych w Europie

. Pocz±tki były trudne, bowiem klub borykał się z problemami natury

finansowej, a poza tym w pierwszych latach istnienia nie miał własnego

stadionu i boiskiem musiał się dzielić z lokalnymi rywalami, np. z drużyn±

El Catala, która była zreszt± pierwszym wielkim przeciwnikiem Barcy. Klub

był jednak coraz popularniejszy i na pocz±tku lat dwudziestych liczył już

ponad pięć tysięcy członków! Jednak FC Barcelona nadal musiała uznawać

wyższo¶ć klubów z Madrytu. Do czasu. W 1929 roku katalończycy po raz

pierwszy zdobyli mistrzostwo Hiszpanii. Ale co dobre, szybko się kończy.

Wraz z dyktatur± generała Franco rozpoczęły się chude lata dla Barcy.

Wojna domowa przetrzebiła szeregi członków klubu. Aparat państwowy zacz±ł

zmuszać Katalończyków do rezygnacji ze swej narodowo¶ci, języka i

tradycji. Jednak efekt był odwrotny do zamierzonego - Katalończycy jeszcze

bardziej podkre¶lali sw± odrębno¶ć. To zaowocowało wzrostem liczby

członków klubu. Na pocz±tku lat pięćdziesi±tych wynosiła ona 25 tysięcy

ludzi. FC Barcelona zdobywała kolejne tytuły mistrzowskie, a wielokrotnie

także Copa del Rey, czyli Puchar Hiszpanii. W latach 1954-1957 wybudowano

kosztem 330 milionów peset nowy stadion - Nou Stadi del Futbol Club

Barcelona, który kibice wkrótce ochrzcili wdzięczn± nazw± Camp Nou . Potem

były kolejne sukcesy, a w klubie grało wielu graczy ¶wiatowej klasy i

sławy. Do jej osi±gnieć można uznać między innymi fakt, że jako jedyny

zespół na naszym kontynecie nieprzerwanie brał udział w rozgrywkach

pucharowych Europy od ich rozpoczecia, czyli 1955 roku ! Masywnie

kolekcjonowali europejskie trofea, ustanawiaj±c rekord, jeżeli chodzi o

zdobywanie nieistniej±cego już Pucharu Zdobywców Pucharów, w rozgrywkach

ktorych okazywali sie najlepsi cztery razy ! Barcelona ponadto

czterokrotnie zdobywała Puchar UEFA ( 3 krotnie był to Puchar Miast

Targowych ) ! Oczywi¶cie triumfowali również na arenie krajowej . Żaden

inny klub w Hiszpani nie może poszcycić się zdobyciem 24 pucharów Hiszpani

( Copa del Rey.) ! Nie można zapemnieć również o 16-tu tytułach

mistrzowskich oraz jednym Pucharze Mistrzów oraz Superpucharze Europy !

CAMP NOU:

Największy stadion piłkarski w Europie – w języku katalońskim El Nou Estadi del Futbol Club Barcelona – może oficjalnie pomie¶cić 98.772widzów. Pierwszy mecz po zakończeniu jego budowy odbył się 24 wrze¶nia 1957 roku i został rozegrany pomiędzy klubami FC Barcelona i Legia Warszawa (wynik meczu: 4-2).

Gospodarzem Camp Nou jest FC Barcelona. Swoje mecze na Camp Nou rozgrywa także reprezentacja Katalonii. Wcze¶niej go¶ciła tu także reprezentacja Hiszpanii, ale ze względów politycznych od wielu lat nie jest to praktykowane. Trybuny zdobi napis będ±cy dewiz± klubu FC Barcelona: Més que un club (Więcej niż klub).

Stadion – jako jeden z niewielu – otrzymał w rankingu UEFA 5 gwiazdek. Wymiary boiska wynosz± 105x 72 m, a plac gry o¶wietlany jest moc± 2180 luksów.

CIEKAWOSTKI:

* FC Barcelona od momentu założenia Primera División, czyli od 1929 r. nieprzerwanie gra w najwyższej klasie rozgrywkowej Hiszpanii.

* Drużyna z Camp Nou na arenie międzynarodowej startuje nieprzerwanie od 50 lat, czyli od pocz±tku powstania europejskich pucharów. Żadna inna drużyna nie może pochwalić się takim osi±gnięciem.

* Najwięcej bramek dla klubu strzelił Alcántara (357).

* Najwięcej spotkań w barwach FC Barcelony rozegrał Migueli (670).

* Najwięcej tytułów z Barcelon± wywalczył Amor (17).

* Najwyższa wygrana w historii: FC Barcelona - Gimna`stic Tarragona 10:1 (1949/50).

* Najwyższa porażka w historii: Athletic Bilbao - FC Barcelona 12:1 (1930/31).

* Najmłodszym piłkarzem, który zagrał mecz w barwach pierwszego składu to Giovanni Dos Santos. Meksykanin miał zaledwie 16,5 roku kiedy zagrał na Tournee w USA z jedn± z amerykańskich drużyn.

* Barcelona nigdy nie miała napisu sponsora na koszulce

MENU:

Galeria

Oficialna Strona FC BARCELONY

Polska Strona FC BARCELONY

Copyright © 2011 by Marcin Ziarniak

Pokaż komentarz
IP: 212.160.166.[...] Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US) AppleWebKit/534.16 (KHTML, like Gecko) Chrome/10.0.648.204 Safari/534.16
#5 web developer 2011-09-20 09:14:21 0
Fachowo i na temat. Dobra robota, dzięki
IP: 192.138.116.[...] Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 1.1.4322; .NET4.0C; .NET4.0E; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729; MS-RTC LM 8; InfoPath.3)

Aby dodać komentarz, musisz podać swój nick, treść komentarza oraz poprawnie przepisać oba słowa z obrazka (słowa muszą być rozdzielone spacją).
W treści komentarza można używać języka formatowania BBcode.