Warning: file_get_contents(http://graph.facebook.com/http://youthcoders.net/html-css/kurs-html/20-laczenie-html-css.html): failed to open stream: HTTP request failed! HTTP/1.0 403 Forbidden in /var/www/old-yc/plugins/content/addthis.php on line 38
Łączenie CSS z HTML-em |
Wpisany przez Patryk yarpo Jar | |||
piątek, 18 września 2009 02:41 | |||
Jest kilka sposobów na połączenie stylów CSS z HTMLem. Przez `dowolny_znacznik' mam na myśli prawie dowolny znacznik. Np `title' nie powinien mieć stylów. A teraz konkretne zastosowanie - zmiana koloru tła strony, oraz koloru czcionki w akapicie: To rozwiązanie jest najprymitywniejszym i najgorszym. Dlaczego? Nawet jeśli chciałbyś, aby kilka akapitów miało taki sam styl, za każdym razem musisz dublować kod. Gdy będziesz chciał zmienić 10 akapitów - musisz zmieniać kod w 10 miejscach. To jest rozwiązanie złe i używaj go w ostateczności. 2. Style w sekcji head Skoro umieszczenie kodu CSS w atrybucie `style' jest złe, to co w zamian? Można zawsze umieścić kod w sekcji head. Oto przykład: Jak widać na powyższym przykładzie mamy dwa akapity o kolorze czerwonym. Jednak jeśli chcielibyśmy zmienić kolor na niebieski, to zmiana ogranicza się do jednego miejsca! A o to właśnie nam chodzi, aby zrobić wiele przy minimalnym wysiłku. Nadal jednak czuję niedosyt... Przecież na wielu stronach chciałbym mieć takie same akapity. Czy na każdej muszę dublować kod? Nie... patrz niżej:) 3. Osobny plik ze stylami Jest to najlepszy sposób na łączanie stylów css z kodem HTML. Jego główne zalety: kod odpowiedzialny za prezentację jest trzymany w jednym miejscu, więc dużo łatwiej jest nim zarządzać raz wczytany nie jest więcej pobierany z serwera! (szybciej się ładuje strona) możliwość wielokrotnego wykorzystania kodu (nawet na kilku różnych stronach, a.pl, b.pl itp.) zmniejszenie rozmiaru pliku html Widzisz już że to wrecz wspaniała rzecz, jednak nadal nie wiesz jak to zrobić :P. Już to naprawiamy, oto kod: W pliku arkusz.css umieszczamy np.: Powyższy kod CSS jest pełnym kodem. Nie musisz w jakikolwiek sposób rozpoczynać kodu CSS w osobnym pliku. Sam kod CSS - bez nagłowków itp. Sposób z osobnym plikiem jest sposobem zdecydowanie najlepszym. Czasem zdarza się, że pozostałe dwa sposoby są warte rozpatrzenia. Jednak zakładaj, że są złe (a wyjątki - ja zawsze - się zdarzą). Tags:
|