wygląd strony - Kurs HTML i CSS
Dobre praktyki / CSS Zorientowane Obiektowo...jest kandydatem na zapisanie jego znaczników w osobnym pliku szablonu. Atrybuty Często obiekty nie są na tyle proste, aby można było określić ich wygląd przy pomocy pojedynczej reguły stylów (jednego selektora). Menu nawigacyjne będzie zawierać elementy podrzędne - listę odnośników - którym również musimy przypisać określony styl. Atrybuty stanowią zbiór wszystkich elementów (znaczników) potomnych obiektu, którym jest przypisany styl. <div class="Menu"> <ul> <li><a...
- CSS dla zielonych / Arkusz stylów CSS
...albo, jeśli wolisz, dedykowanego edytora CSS. W pliku tym wpisuje się listę tzw. reguł stylów, za pomocą których możliwe jest określanie wyglądu elementów na stronie. Każda reguła stylów składa się zawsze z dwóch następujących bezpośrednio po sobie części: Selektora - czyli elementu (znacznika) na stronie, któremu chcemy zmienić wygląd Deklaracji ujętej w nawiasy klamrowe, w której określa się, w jaki sposób chcemy zmienić wygląd selektor1 { Tu wpisuje się deklaracje stylów...
Wykaz skryptów / Pozostałe skryptyAktywne przyciski Przyciski które zmieniają wygląd, po wskazaniu ich myszką (przydatne przy tworzeniu menu). Data aktualizacji strony Automatyczne wyświetlenie daty ostatniej aktualizacji strony. Aktualna data Wyświetlenie na stronie aktualnej daty. Nowość Sygnalizowanie nowości bezpośrednio w spisie treści lub na każdej ze stron, poprzez wyświetlenie specjalnego obrazka albo napisu. System newsów Automatyczny system wiadomości na stronie WWW, które są wyświetlane tylko przez określony...
- Wstawianie stylów CSS / Zewnętrzny arkusz stylów <link "stylesheet"> @charset
...przeniesione do podanej strony (podczas jej wyświetlania). Wszystkie podstrony serwisu z osadzonym w swoim nagłówku takim poleceniem, uzyskają wygląd, określony w załączonym arkuszu stylów. W pojedynczym dokumencie HTML można dołączyć dowolną liczbę zewnętrznych arkuszy stylów - każdy jako osobny element <link rel="stylesheet">. W przypadku konfliktów, ważniejsze będą deklaracje z arkusza dołączonego później. Zwykle tworzy się pojedynczy zewnętrzny arkusz i załącza go w całym serwisie...
Nagłówek i treść HTML / Strona mobilna <link media>...Ten link informuje przeglądarkę o istnieniu alternatywnej wersji strony przeznaczonej dla urządzeń o mniejszych ekranach. Jak sprawdzić wygląd strony na urządzeniach mobilnych? Aby sprawdzić wygląd strony na urządzeniach mobilnych, można skorzystać z narzędzi deweloperskich przeglądarki, takich jak tryb responsywności. Wchodząc w inspekcję elementu (Ctrl+Shift+I), można przełączyć się w tryb responsywności (ikona ze smartfonem) i dostosować widok do różnych rozmiarów ekranów...
- CSS dla zielonych / Wstawienie arkusza stylów CSS <link "stylesheet">
...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 plik posiadał rozszerzenie *.css. W powyższym przykładzie jest to plik pod nazwą "style.css", który znajduje się w tym samym katalogu co dokument *.html. Można go oczywiście zapisać w innej lokalizacji - wtedy zamiast "style.css" trzeba podać pełną ścieżkę dostępu (tworzy się ją w analogiczny sposób, jak...
- Tekst HTML / Kod poprawny semantycznie
...HTML wyróżniamy dwa podstawowe typy elementów określających atrybuty tekstu: Znaczniki formatujące - mają za zadanie tylko i wyłącznie zmienić wygląd tekstu, który obejmują, bez żadnego odniesienia do znaczenia tego tekstu. Są to np.: B (pogrubienie), I (pochylenie), U (podkreślenie), S (przekreślenie), SMALL (czcionka pomniejszona). Użycie tych znaczników gwarantuje, że w każdej sytuacji tekst otrzyma określone formatowanie (wygląd), ale nic nie mówi o charakterze tego tekstu * . Innymi...
- Wstawianie stylów CSS / Alternatywny arkusz stylów <link "alternate stylesheet">
...zaznaczenie spowoduje dołączenie wszystkich takich arkuszy jednocześnie. Alternatywny arkusz stylów pozwala udostępnić użytkownikowi kilka wersji wyglądu strony do wyboru. Projektuje się wtedy kilka zewnętrznych arkuszy CSS, a następnie osadza w specjalny sposób, dzięki czemu w przeglądarce użytkownika pojawi się możliwość wyboru jednego spośród przygotowanych wyglądów. Jest to namacalny dowód potęgi języka CSS. Nie trzeba tworzyć, a potem aktualizować kilku wersji witryny, aby zapewnić...
- HTML5 / Sekcja <section>
...do: <a href="#moja-sekcja">Moja sekcja</a> Sekcja nie powinna być używana jako ogólny pojemnik na elementy. Jeżeli istnieje potrzeba, aby zmienić wygląd kilku następujących po sobie elementów, należy do tego użyć znacznika DIV, który w odróżnieniu od SECTION, nie niesie ze sobą żadnego znaczenia semantycznego. Ponadto znacznik SECTION został przeznaczony do tworzenia ogólnych sekcji dokumentu. Lepiej jest używać znaczników, które jak najbardziej szczegółowo opisują znaczenie treści. Dlatego...
- Formularze HTML / Przycisk <button>
...Przycisk zablokowany!Ten przycisk jest zablokowany - disabled (nie obsługuje Opera 6). W niektórych systemach operacyjnych i przeglądarkach wygląd przycisków o dużych rozmiarach może być bardzo nieestetyczny! Pytania i odpowiedzi <button> Jak zrobić przyciski w HTML? Aby wstawić w dokumencie HTML przycisk, po kliknięciu którego nastąpi przejście do innej strony, można się posłużyć odsyłaczem obrazkowym. Co to jest BUTTON w HTML? Jest to znacznik, za pomocą którego możemy...