rozmiar - Kurs HTML i CSS
Oprawa graficzna / "Duszki" CSS...aby czekać nawet kilka minut, na załadowanie od razu wszystkich pełnowymiarowych zdjęć. Formaty graficzne Kluczowe znaczenie dla zmniejszenia rozmiaru plików zdjęć, a zatem równocześnie przyspieszenie wczytywania strony, ma dobranie odpowiedniego formatu oraz stopnia kompresji. Popularne formaty internetowe oferują wbudowane algorytmy kompresji danych. W przypadku kompresji bezstratnej nie ma żadnej utraty jakości na wynikowej grafice. Kompresja stratna co prawa powoduje utratę jakości...
Formularze HTML / Obszar tekstowy <textarea>...tekstowe wewnątrz formularza. Pole takiego typu może być używane np. do wpisania komentarza bądź innej nieco dłuższej wiadomości. Jak zmienić rozmiar pola tekstowego HTML? Domyślnie każde wieloliniowe pole tekstowe ma ustaloną zarówno szerokość jak i wysokość, które mogą się różnić w zależności od przeglądarki. Aby ustawić szerokość takiego pola np. na 100 znaków, a wysokość na 10 linijek tekstu, można się posłużyć następującym kodem: <textarea name="..." cols="100...
- Komendy HTML 4.01 / INPUT
...to podaje maksymalną liczbę znaków, możliwych do wprowadzenia NAME="nazwa" Nazwa kontrolna READONLY Kontrolka tylko do odczytu SIZE="rozmiar" Inicjalizująca szerokość kontrolki w pikselach lub w znakach (gdy TYPE="text" lub TYPE="password") SRC="adres" Gdy TYPE="image", to podaje lokalizację obrazka, który ma być użyty do ozdobienia przycisku graficznego STYLE="styl" Informacje stylów (CSS) TABINDEX="liczba" Określa pozycję elementu w kolejności wybierania tabulatorem...
- Komendy CSS3 / Tło i obramowanie CSS
...<bg-position> Inicjalizacja 0% 0% Zastosowanie wszystkie elementy Dziedziczenie nie Procenty odnosi się do powierzchni pozycjonowania tła minus rozmiar obrazka tła background-repeat Powtarzanie tła Wartość <repeat-style> Inicjalizacja repeat Zastosowanie wszystkie elementy Dziedziczenie nie Procenty nie background-size Rozmiary tła Wartość <bg-size> Inicjalizacja auto Zastosowanie wszystkie elementy Dziedziczenie nie Procenty odnosi się do powierchni pozycjonowania tła...
- Promocja strony WWW / Bannery i buttony
...nawet na stronach systemów wymiany bannerów. Ważne jest, aby przestrzegać przyjętych wymiarów bannerów (468x60 lub 400x50 pikseli - ten drugi rozmiar przyjął się szczególnie w polskim Internecie) oraz buttonów (88x31 pikseli). Pilnuj również, aby pliki bannerów i buttonów nie miały zbyt dużej objętości, ponieważ wydłuża to wczytywanie strony i zmniejsza prawdopodobieństwo kliknięcia. Zmniejszenie objętości można uzyskać przez kompresję graficzną obrazków, którą obsługuje praktycznie...
- Znaki specjalne HTML / Encje HTML
...po nim linię poprzez użycie znacznika <br>, co niekoniecznie może być działaniem pożądanym, biorąc pod uwagę fakt, że użytkownik może zmienić rozmiar czcionki lub w ogóle nie posiadać ustalonego na stronie kroju czcionki, a wtedy układ akapitu może zmienić się tak, że przedzielenie w wybranym stałym miejscu będzie niewłaściwe, za to byłoby wymagane gdzie indziej. Przykład ­ Przykład
- Komendy HTML 4.01 / SELECT
...LANG="en" oznacza angielski, LANG="pl" - polski itd.) MULTIPLE Wybór wielu opcji jednocześnie NAME="nazwa" Przypisuje nazwę kontrolną SIZE="rozmiar" Liczba wierszy w liście, które będą jednocześnie widoczne STYLE="styl" Informacje stylów (CSS) TABINDEX="liczba" Określa pozycję elementu w kolejności wybierania tabulatorem TITLE="tekst" Tekst pomocniczy Zdarzenia: onfocus, onblur, onchange, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout...
- HTML5 / Leniwe ładowanie <iframe loading, img loading>
...elementy - nawet znajdujące się na samym dole strony, które w tym momencie w ogóle nie są widoczne na ekranie. Jeśli zdjęcia lub widżety mają duży rozmiar, spowolni to wczytywanie całej strony. Dodatkowo może narazić na dodatkowe koszty użytkowników korzystających z połączenia mobilnego. Możemy tego uniknąć stosując atrybut loading="lazy". Pytania i odpowiedzi <iframe loading, img loading> Co to jest leniwe ładowanie w HTML? Leniwe ładowanie w HTML to technika optymalizacji wydajności...
- Selektory pseudoklas CSS / Pseudoklasy typu :first-of-type :last-of-type :only-of-type
...pierwszej definicji listy. Oczywiście można to zrobić nadając mu klasę. Nie jest to jednak najlepsze rozwiązanie, ponieważ niepotrzebnie zwiększa rozmiar dokumentu, a przy tym jeśli w przyszłości zrezygnujemy z takiego formatowania (lub jedna ze skórek nie będzie go wymagać), zbędna klasa zacznie zaśmiecać kod. Jednocześnie nie możemy się posłużyć selektorem pierwszego dziecka, gdyż pierwszym dzieckiem listy będzie znacznik terminu (DT), a nie definicja (DD). Problem rozwiązują podane wyżej...
- Marginesy CSS / Wymiarowanie pudełka {box-sizing}
...Pytania i odpowiedzi {box-sizing} Do czego służy "box-sizing"? Właściwość CSS box-sizing pozwala kontrolować sposób obliczania całkowitego rozmiaru elementu, uwzględniając marginesy, padding i obramowanie. Dzięki temu można precyzyjnie zarządzać wymiarami elementów w modelu pudełkowym. Domyślnie wartość box-sizing to content-box, gdzie szerokość i wysokość elementu obejmują tylko treść. Co to jest "box-sizing: border-box"? "box-sizing: border-box" to wartość właściwości CSS...