wysokość - Kurs HTML i CSS
Media CSS / Wybór medium @media...line-height: 1.2 } } Powyższe polecenia, wpisane w arkuszu stylów, definiują rozmiar czcionki 10pt dla wydruku, 12pt dla ekranu komputerowego oraz wysokość linii 1.2 jednocześnie dla ekranu i wydruku.
- Układ wielokolumnowy CSS / Multi-column layout
...po jej prawej stronie. Po zmianie wielkości lub rodzaju czcionki, tekst w kolumnie tabeli ułoży się w zupełnie inny sposób - najprawdopodobniej wysokość przestrzeni zajmowanej przez tekst w kolumnach nie będzie identyczna. Na niewielkich ekranach - np. telefonów komórkowych - ustalona zbyt duża liczba kolumn w tabeli może sprawić, że będą one zdecydowanie zbyt wąskie. W arkuszu CSS dla urządzeń mobilnych nie można zmniejszyć liczby kolumn w wierszu tabeli. Na wydruku kolumna tabeli może...
- Układ elastyczny CSS / Przepływ elastyczny {flex-direction, flex-wrap, flex-flow}
...uwagę, że wszystkie elementy są identycznej wysokości: To jest blok nr 1 blok 2 blok 3 blok 4 blok 5 "flex-flow: row wrap" - zwróć uwagę, że wysokość bloków dopasowuje się automatycznie w każdym osobnym wierszu układu: To jest blok nr 1 blok 2 blok 3 blok 4 blok 5 flex-flow: row-reverse nowrap To jest blok nr 1 blok 2 blok 3 blok 4 blok 5 flex-flow: row-reverse wrap-reverse blok 1 blok 2 blok 3 blok 4 blok 5
- Układ elastyczny CSS / Wyrównanie wiersza {align-items, align-self}
...do obu krawędzi jednocześnie (domyślnie) Polecenie steruje wyrównaniem jednego wiersza wewnątrz kontenera elastycznego, kiedy mają one różną wysokość. Przykład {align-items} align-items: flex-start To jest blok nr 1 blok 2 blok 3 align-items: flex-end To jest blok nr 1 blok 2 blok 3 "align-items: center" - ten sposób pozwala wyśrodkować w pionie element, nawet jeżeli z góry nie wiemy, ile treści będzie się w nim znajdować: To jest blok nr 1 blok 2 blok 3...
- Układ elastyczny CSS / Kolejność {order}
...się w kodzie źródłowym przed kolumną menu. Mimo tego szerokość automatycznie dopasowuje się do okna przeglądarki. Dodatkowo warto zwrócić uwagę, że wysokość obu kolumn jest identyczna. Uzyskanie takiego efektu w tradycyjny sposób byłoby bardzo trudne i najczęściej wymagało pójścia na pewne kompromisy. <div id="top"> <div id="TRESC">Treść strony...</div> <div id="MENU">Menu nawigacyjne</div> </div> #top { display: flex; } #MENU { width: 150px; min-width: 150px; order: -1; }...
- Układ elastyczny CSS / Wyrównanie wierszy {align-content}
...do obu krawędzi jednocześnie (domyślnie) Polecenie steruje wyrównaniem wielu wierszy wewnątrz kontenera elastycznego, kiedy ich sumaryczna wysokość jest za mała, aby wypełnić całą dostępną przestrzeń. Przykład {align-content} align-content: flex-start blok 1 blok 2 blok 3 blok 4 blok 5 align-content: flex-end blok 1 blok 2 blok 3 blok 4 blok 5 align-content: center blok 1 blok 2 blok 3 blok 4 blok 5 align-content: space-between blok 1 blok 2 blok 3 blok...
- Komendy CSS3 / Podstawowy interfejs użytkownika CSS
...Wymiarowanie pudełka Wartość content-box | border-box Inicjalizacja content-box Zastosowanie wszystkie elementy, które akcektują szerokość i wysokość Dziedziczenie nie Procenty nie Media visual caret-color Kolor karetki tekstowej Wartość auto | <color> Inicjalizacja auto Zastosowanie wszystkie elementy Dziedziczenie tak Procenty nie Media interactive cursor Kursor myszki Wartość [ [<url> [<x> <y>]?,]* [ auto | default | none | context-menu | help | pointer | progress...
Nowe okno / Generator okienMożliwe jest określenie wyglądu nowego okna (rozmiarów, położenia, pokazanie/ukrycie pasków menu, narzędzi, statusu itp.), poprzez podanie w poleceniu dodatkowych parametrów. Zamiast opisu zamieszam poniżej generator. Otrzymany w nim kod, należy wpisać w miejsce wyróżnionego tekstu, np. jako wartość atrybutu onload="..." (pierwszy sposób). function generuj(f) { var str = ""; var atr = ""; if (f.elements['width'].value && atr) atr += ","; if (f.elements['width'].value) atr += "width...
- Komendy CSS3 / Mowa CSS
Źródło: CSS Speech Module Spis treści cue cue-after cue-before pause pause-after pause-before rest rest-after rest-before speak speak-as voice-balance voice-duration voice-family voice-pitch voice-range voice-rate voice-stress voice-volume cue Atrybuty mieszane sygnału wywoławczego Wartość <'cue-before'> <'cue-after'>? Inicjalizacja zobacz cechy indywidualne Zastosowanie wszystkie elementy Dziedziczenie nie Procenty nie Media speech cue-after Sygnał...
- AutoIFRAME / Kilka ramek AutoIFRAME
Czasami zachodzi potrzeba umieszczenia na jednej stronie kilku ramek <iframe>...</iframe>, których wysokość powinna się automatycznie dopasowywać do zawartości. Oczywiście dla każdej takiej ramki proces dostosowywania wysokości musi zachodzić niezależnie. Aby to zrobić, należy dla każdej takiej ramki należy ustawić odrębny identyfikator id="...". Na przykład tak mógłby wyglądać fragment strony głównej serwisu: <iframe src="..." name="..." id="autoiframe" width="100%" height="560">...</iframe>...