image - Kurs HTML i CSS
Komendy CSS 2 / Specyfikacja CSS...że jedna lub więcej z nich musi się pojawić w deklaracji stylu w dowolnym porządku, np. dla zestawienia: <'background-color'> || <'background-image'> || <'background-repeat'> || <'background-attachment'> || <'background-position'> można podać: <'background-repeat'> <'background-image'> Nawiasy kwadratowe "[" oraz "]" służą do grupowania, np. wyrażenie: a b | c || d e jest równoważne: [ a b ] | [ c || [ d e ]] Gwiazdka "*" wskazuje, że poprzedzający typ, wyraz lub grupa może się...
Aktywne przyciski / Pamięć podręcznaStosując bezpośrednio powyższe skrypty, można zauważyć pewien nieprzyjemny efekt: po pierwszym wskazaniu bądź kliknięciu aktywnego przycisku, trzeba nieco zaczekać, aż załaduje się obrazek, który ma zostać wyświetlony. Dzieje się tak dlatego, ponieważ dopóki nie zostanie wywołana akcja, przeglądarka nie wie jaki obrazek, dajmy na to po podświetleniu, ma zostać wyświetlony. Jednak po pierwszym użyciu przycisku, dodatkowa grafika zostanie wczytana i zapisana w pamięci podręcznej przeglądarki...
Znaki specjalne HTML / Symbole...⁄ Literowe ℘ ℘ Script capital "P" (power set, Weierstrass "p") Weierstrass "p" (w IE6 tylko czcionka Unicode) ℘ ℑ ℑ Blackletter capital "I" (imaginary part) Część urojona liczby zespolonej (w IE6 tylko czcionka Unicode) ℑ ℜ ℜ Blackletter capital "R" (real part symbol) Część rzeczywista liczby zespolonej (w IE6 tylko czcionka Unicode) ℜ ™ ™ Trade mark sign Znak handlowy ™ ℵ ℵ Alef symbol (first...
- Tryb Quirks / Co zmienia przejście z trybu Quirks do trybu zgodności ze standardami?
...text-decoration, margin, padding, border, border-top, border-right, border-bottom, border-left, border-color, border-width, border-style, list-style-image, list-style, clip oraz behavior, text-autospace i layout-grid. W trybie zgodności dla własności font musimy obowiązkowo podać przynajmniej wielkość i rodzaj czcionki, w przeciwnym razie cała deklaracja zostanie zignorowana. Wcześniejsze wersje Internet Explorera przyjmowały także częściowe ustawienia. Dotyczy to również przeglądarki Opera...
- Komendy CSS 2 / background
WARTOŚĆ [<'background-color'> || <'background-image'> || <'background-repeat'> || <'background-attachment'> || <'background-position'>] | inherit OPIS Atrybuty mieszane tła INICJALIZACJA zobacz cechy indywidualne ZASTOSOWANIE wszystkie elementy DZIEDZICZENIE nie PROCENTY dla cechy 'background-position' MEDIA visual
- Komendy CSS 2 / list-style
WARTOŚĆ [ <'list-style-type'> || <'list-style-position'> || <'list-style-image'> ] | inherit OPIS Atrybuty mieszane stylu wykazu INICJALIZACJA zobacz cechy indywidualne ZASTOSOWANIE elementy wykazu DZIEDZICZENIE tak PROCENTY nie MEDIA visual
- Menu w CSS / Poziome menu
...color: #fff; padding: 10px 20px; border-right: 1px solid #fff; border-right: 1px solid #fff; } ul a:hover { background-color: #800; background-image: url("tlo2.gif"); } Chociaż w tym przykładzie rozmiary odnośników nie zostały ustalone, wyświetliliśmy je blokowo z uwagi na możliwy błąd w bardzo starych przeglądarkach. Ponadto konieczne było przypisanie oblewania (float: left) również znacznikowi obejmującemu pozycje listy (<ul>...</ul>), ponieważ bez tego menu wyglądałoby następująco...
- Dobre praktyki / Przykazania webmastera
...dotyczy wszystkich odwołań do plików graficznych, występujących arkuszu CSS - jeśli uległy zmianie, należy podnieść im numer rewizji: background-image: url("plik.gif?2"); Gdzie to tylko możliwe, staraj się skracać zapis w regułach stylów Oszczędzisz sobie w ten sposób pisania, a także zmniejszasz rozmiar arkusza CSS, co przyspiesza ładowanie strony. Używaj atrybutów mieszanych - np. margin zamiast zestawu: margin-top, margin-right, margin-bottom, margin-left. Nie dopisuj jednostki do...
Dla nauczycieli / Scenariusz lekcji informatyki dla liceum i technikum...padding, border, margin, border-radius. Tworzenie stylowych boksów z tekstem. 10 min - Tła i stylizowanie odsyłaczy Właściwości: background-image, color. Stylizacja odsyłaczy tak, aby zmieniały się po najechaniu kursorem (:hover). 5 min - Ćwiczenie praktyczne Strona z sekcją w ramce, linkami z efektem :hover, tłem obrazkowym i klasami CSS. 5 min - Zadanie domowe Rozbudować stronę o co najmniej 3 różne klasy stylów i dodać estetyczną sekcję z tłem i linkami. Lekcja 7...
- Tło CSS / Usunięcie tła {background: none, background-color: transparent}
...usunąć tylko wybrane, stosując odpowiednie polecenia dla każdej własności, którą chcemy usunąć (np. background-color: transparent; background-image: none itd.). Pozwala to np. usunąć tło obrazkowe, lecz pozostawić kolor tła. Działają one oczywiście nie tylko z zewnętrznym arkuszem, ale również z wewnętrznym - zgodnie z zasadami kaskadowości. Przykład {background-color: transparent} Gdyby arkuszu stylów tej strony [zobacz: Wstawianie stylów], została umieszczona taka linijka: h4...