przeglądarka - Kurs HTML i CSS
- Przeglądarka zdjęć
...pokazu slajdów (liczony w sekundach). Czas ten jest liczony od momentu pełnego załadowania zdjęcia. Następnie na stronie, gdzie ma być umieszczona przeglądarka zdjęć, należy w nagłówku dokumentu (wewnątrz <head>...</head>) wstawić: <script src="przegladarka_zdjec.js"></script> W wyróżnionym miejscu oczywiście należy podać lokalizację utworzonego wcześniej pliku przegladarka_zdjec.js. Teraz wystarczy wkleić na stronie w wybranym miejscu przykładowy kod: <script> var przegladarka_zdjec...
- Formularze HTML / Forma odszyfrowana <form enctype accept-charset>
...programu pocztowego czy skryptu na serwerze. W takiej sytuacji wystarczy zdefiniować, jakiej strony kodowej używa system odbierający dane, a przeglądarka podczas wysyłania formularza powinna automatycznie skonwertować cały tekst. Na przykład, jeśli nasza strona jest zapisana przy użyciu kodowania znaków utf-8, ale wiemy, że system, do którego wysyłamy formularz używa kodowania windows-1250, powinniśmy wpisać: <form action="..." accept-charset="windows-1250">...</form> Niestety...
- HTML5 / Ewolucja języka HTML
...HTML jest plikiem tekstowym, w którym wpisujemy wszystkie polecenia dotyczące formatowania tekstu, wstawiania grafiki i inne. Jak sprawdzić czy przeglądarka obsługuje HTML5? Przejdź na stronę pt. Czy mogę używać..., a następnie w sekcji HTML5 zobacz, które przeglądarki poprawnie wspierają różne elementy tego języka. Jaką mam wersję Chrome? Przeglądarka Google Chrome aktualizuje się automatycznie. Zatem prawdopodobnie masz zainstalowaną najnowszą jej wersję. Aby to sprawdzić...
- HTML5 / Składnia (X)HTML5
...<!DOCTYPE html> Specyfikacja pozwala również na stosowanie specjalnej deklaracji, która ma na celu uzyskanie kompatybilności z bardzo starymi przeglądarkami: <!DOCTYPE html SYSTEM "about:legacy-compat"> Wydaje się jednak, że nie ma takiej potrzeby i standardowa skrócona deklaracja jest w zupełności wystarczająca. Przykładowy dokument XHTML5 <?xml version="1.0" encoding="UTF-8"?> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>...</title> </head> <body>...
- HTML5 / Zmienione elementy i atrybuty HTML5
...użytkownika. MENU Służy do budowy użytecznych pasków narzędzi oraz menu kontekstowych. NOSCRIPT Zostanie wyświetlony wyłącznie, jeśli przeglądarka w ogóle nie obsługuje dynamicznych skryptów, a nie kiedy nie potrafi zinterpretować języka skryptowego, określonego w poprzedzającym go znaczniku SCRIPT. S Oznacza treść, która nie jest dłużej trafna lub istotna, z punktu widzenia pozostałej zawartości dokumentu. SCRIPT Istnieje możliwość określenia dodatkowych wartości atrybutu...
- HTML5 / Wstępne ładowanie <link "preload" as>
...któremu można przyspieszyć wczytywanie zewnętrznych elementów potrzebnych do wyświetlenia strony poprzez załadowane ich z wyprzedzeniem, zanim przeglądarka faktycznie będzie ich potrzebować. W tym celu w nagłówku strony wystarczy wstawić znacznik LINK z odpowiednimi atrybutami rel="preload" i as="...". Przykład <link "preload" as> Ten obrazek zostanie załadowany z wyprzedzeniem, zanim będzie już potrzebny: <head> <link rel="preload" as="image" type="image/jpeg" href="obrazek.jpg">...
- HTML5 / Blokowanie wyświetlania <link "stylesheet" blocking, script blocking, style blocking>
...to jednak prowadzić do nieoczekiwanych rezultatów. Dlatego na przykład osadzenie zewnętrznego skryptu JavaScript na stronie zwykle powoduje, że przeglądarka przestaje wykonywać inne operacje, dopóki go nie załaduje i nie uruchomi. Możemy jednak pozwolić na wykonywanie niektórych czynności równolegle - np. ładowanie innych zasobów zewnętrznych osadzonych w dokumencie - a zablokować jedynie samo wyświetlanie strony (ang. render), dopóki kod skryptu nie zakończy swojego uruchomienia i nie...
- HTML5 / Priorytet ładowania <img fetchpriority, link fetchpriority, script fetchpriority>
...Na przykład: <img src="image.jpg" fetchpriority="high"> lub <link rel="preload" as="style" href="style.css" fetchpriority="high">. To zapewni, że przeglądarka pobierze te zasoby z wyższym priorytetem.
- HTML5 / Walidacja pól formularza <input pattern>
...Jest to pewien rodzaj filtru, który uniemożliwia nieprawidłowe wypełnienie formularza. Jeśli użytkownik wpisze wartość w niepoprawnym formacie, przeglądarka wyświetli komunikat błędu i zablokuje możliwość wysłania formularza. Komunikat ten będzie jednak dość ogólny - np.: "Podaj wartość w wymaganym formacie". Niestety użytkownik może się nie domyślić, co właściwie oznacza ten "wymagany format". Dlatego zaleca się dodatkowo ustawić atrybut title="...", w którym możemy bardziej szczegółowo...
- Czcionki CSS / Rodzaj czcionki {font-family}
...czcionki, podane w pierwszej kolejności (najczęściej wykorzystuje się rodziny: serif lub sans-serif). Niestety, ponieważ w takim przypadku to przeglądarka automatycznie dobiera rodzaj czcionki, może się zdarzyć, że wybierze czcionkę, która niepoprawnie zapisuje polskie znaki (tak się właśnie stało w mojej przeglądarce z rodziną fantasy). Chociaż jeśli chodzi o rodziny podstawowe (serif, sans-serif, monospace), wszystko powinno być w porządku. Przykład {font-family: serif sans-serif...


