przeglądarki - Kurs HTML i CSS
Tekst CSS / Dekoracja tekstu {text-decoration}...Polecenie umożliwia na wybór określonej dekoracji tekstu (np. podkreślenie). Migotanie może nie być interpretowane przez wszystkie przeglądarki! Przykład {text-decoration} dekoracja none dekoracja underline dekoracja line-through dekoracja overline dekoracja blink (tylko starsze przeglądarki) Ciekawą możliwością może być łączenie powyższych wartości w jednej deklaracji, np.: selektor { text-decoration: underline line-through overline } A oto efekt: Tekst...
- Pozycjonowanie CSS / Pozycja ustalona {position: fixed}
...od prawej krawędzi okna bottom: wartość - odległość od dolnej krawędzi okna Wyraz "wartość" oznacza konkretną odległość od podanej krawędzi okna przeglądarki. Należy ją wpisać używając jednostek długości. Wartość ujemna oznacza przesunięcie w przeciwną stronę. Podanie auto oznacza położenie automatyczne. Można oczywiście łączyć parametry, np. left: 1cm; top: -10px. Polecenie to działa podobnie jak pozycjonowanie absolutne, z tą różnicą, że pozycja elementu jest zawsze obliczana względem...
- Wykazy CSS / Typ stylu wykazu {list-style-type}
...lower-roman - małe liczby rzymskie Przykład list-style-type: lower-roman Punkt pierwszy Punkt drugi Punkt trzeci Oprócz tego współczesne przeglądarki obsługują dodatkowo następujące typy: decimal-leading-zero ("prowadzące zero" - np.: 01, 02, 03...) Przykład list-style-type: decimal-leading-zero Punkt pierwszy Punkt drugi Punkt trzeci georgian (gruzińskie: an, ban, gan... he, tan, in, in-an...) Przykład list-style-type: georgian Punkt pierwszy Punkt drugi Punkt trzeci...
- Selektory pseudoelementów CSS / Cudzysłowy {quotes}
...obejmować cudzysłowami, gdyż powinna zrobić to przeglądarka. Ponadto, ponieważ w różnych językach (mówionych) używa się różnych znaków cudzysłowu, przeglądarki powinny wygenerować takie, które odpowiadają aktualnemu językowi treści. Od języka zależą również znaki cudzysłowów w cytatach zagnieżdżonych, czyli gdy jeden cytat znajduje się wewnątrz innego. Niestety problem w tym, że przeglądarki zwykle sobie z tym nie radzą 🙁 Między innymi z tego powodu specyfikacja CSS 2 umożliwia jawne...
- Pozycjonowanie CSS / Pozycja relatywna {position: relative}
...to przykryte przez ten element. Należy przy tym pamiętać, że często ustawienie elementów strony zależy od rozdzielczości ekranu i rozmiarów okna przeglądarki! Przykład {position: relative} Szary prostokąt poniżej, który jest częściowo przykryty, przedstawia położenie spoczynkowe obrazka, poddanego pozycjonowaniu: position: relative; left: 50px; top: 45px. Dlatego obrazek ten jest oddalony od lewej krawędzi swojego położenia spoczynkowego o 50px (pikseli), a od górnej o 45px. Położenie...
Aktywne przyciski / Pamięć podręczna...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, czyli na dysku lokalnym użytkownika. Dlatego przy drugim użyciu aktywnego przycisku, nic już się nie doczytuje. Istnieje możliwość wcześniejszego poinformowania przeglądarki o dodatkowych obrazkach aktywnych przycisków, dzięki czemu zostaną one jeszcze przed pierwszym użyciem zapisane w pamięci podręcznej, a więc już podczas ich...
Nagłówek i treść HTML / Tytuł strony <title>...był zbyt długi (najwyżej kilka wyrazów). Powinien on również odnosić się do treści zawartych na danej stronie. Tytuł pojawia się na belce tytułowej przeglądarki internetowej (na samej górze okna programu, na karcie ze stroną), a także w wyszukiwarkach sieciowych, po odnalezieniu Twojej strony - dlatego właśnie nie może on być zbyt długi. Trafny tytuł może również zachęcić internautów do obejrzenia Twojej strony. Taki sam tytuł na wszystkich podstronach serwisu nie jest dobrym pomysłem, a...
- Galeria zdjęć HTML / Klasyczna galeria zdjęć
...należy użyć odsyłacza obrazkowego (podstawowego). Prawie zawsze stosuje się również atrybut target="_blank", który powoduje otwarcie nowego okna przeglądarki: <a target="_blank" href="ścieżka do dużego obrazka"><img src="ścieżka do pliku miniaturki obrazka" alt="Tekst alternatywny" border="0"></a> Większość nowych przeglądarek potrafi automatycznie otworzyć obrazek w nowym oknie, jednaki nie będzie wtedy możliwości szybkiej nawigacji pomiędzy kolejnymi zdjęciami z galerii. Natomiast...
- HTML5 / Ewolucja języka HTML
...ukrywać, że wprowadzenie XHTML 2.0 mogłoby być również sporym problemem dla zwykłych użytkowników, którzy nie mając zainstalowanej najnowszej wersji przeglądarki zapewne nie mogliby w ogóle wyświetlić stron zgodnych z nowym standardem. Z tych powodów prace nad XHTML 2.0 zostały ostatecznie przerwane i specyfikacja ta zapewne nigdy nie zostanie ukończona. Problem jednak nadal pozostał. Dzisiaj Internet nie taki sam, jak w 1997 roku, kiedy dominowały statyczne dokumenty tekstowe, a...
- Układ elastyczny CSS / Kolejność {order}
...zgodnie z zaprojektowaną grafiką serwisu. Dzięki temu możemy tworzyć bardziej dostępne dokumenty. Przykładowo dla osoby niewidomej, która używa przeglądarki z syntezatorem mowy, prawdopodobnie korzystniej będzie, jeśli zapoznając się z katalogiem produktów w sklepie internetowym, najpierw usłyszy informacje o nazwie produktu, a potem jego opis. Zdjęcie jest w tym przypadku zupełnie nieważne, dlatego najlepiej jest wstawić je na końcu. Jednak dla użytkowników z dobrym wzrokiem właśnie...