tekstu - Kurs HTML i CSS
Drukowanie CSS / Rozmiar papieru @page {size}...spacją Typowa drukarka najczęściej drukuje strony w orientacji pionowej (tzw. portret). Taki układ zwykle najlepiej sprawdza się przy drukowaniu tekstu. Na stronie możemy mieć jednak także zdjęcia np. krajobrazów, które typowo mają układ poziomy. W takiej sytuacji zdjęcie nie zostanie automatycznie obrócone, a więc zajmie tylko niewielki fragment kartki papieru. Użytkownik może co prawda samodzielnie zmienić orientację papieru przed uruchomieniem wydruku, ale nie wszyscy potrafią to...
- Drukowanie CSS / Druk dwustronny @page :left :right
...wartość } Strony prawe: @page :right { cecha: wartość } Jako cecha i wartość można wstawić jedną lub więcej deklaracji odpowiednich dla kontekstu strony. Niektóre drukarki posiadają specjalny podajnik papieru pozwalający automatycznie zadrukowywać kartki po ich obu stronach. Nawet jeśli urządzenie nie ma wbudowanej takiej funkcji, druk dwustronny można zrealizować ręcznie: najpierw drukując nieparzyste strony, a następnie przekładając je odwrotnie z powrotem do podajnika papieru i...
- Drukowanie CSS / Po co drukować strony internetowe?
...kolorystyki - zamiana kolorowych elementów na odcienie szarości, co pozwala oszczędzić tusz lub toner. Dostosowanie marginesów i formatowania tekstu - optymalizacja przestrzeni i czytelności na papierze. Kompletny przewodnik po stylowaniu wydruku za pomocą CSS W dalszej części tego rozdziału dowiesz się, jak wykorzystywać CSS do kontrolowania wyglądu stron internetowych podczas wydruku. Omówimy m.in. takie zagadnienia jak przełamanie strony przy pomocy page-break-before i...
- Jednostki CSS / Łańcuchy znakowe
...jest bardzo długi, można go przedzielić na dwie linie, ale wtedy trzeba koniecznie postawić na końcu pierwszej linii (w miejscu przedzielenia tekstu) znak odwróconego ukośnika \ (backslash). Po znaku \ ani przed następną linią nie należy już stawiać cudzysłowu. Przykładowo wyrażenie: "1234567890\ 12345" jest równoważne łańcuchowi: "123456789012345" Niestety sposób ten nie zawsze działa poprawnie! W łańcuchach znakowych można wprowadzać znaki ASCII używając notacji: \HEX, gdzie HEX...
- Kolory CSS / Sposoby definiowania kolorów CSS
...Jest to bardzo wygodny sposób na przypisanie np. identycznego koloru obramowania co znajdujący się w nim tekst. Dzięki temu przy zmianie koloru tekstu nie będziemy musieli pamiętać, aby zaktualizować również obramowanie - wtedy stanie się to automatycznie.
- Selektory CSS
...jest odpowiednio: pierwszym, ostatnim bądź jedynym bratem typu E Pseudoklasy typu 3 E:empty element E, który nie ma dzieci ani nie zawiera tekstu Pusty element 3 E:link E:visited element E, który jest kotwicą hiperlinku (odsyłaczem), której cel (strona docelowa) jeszcze nie został odwiedzony (:link) lub został już odwiedzony (:visited) Odsyłacz podstawowy Odsyłacz odwiedzony 1 E:active E:hover E:focus element E podczas pewnych akcji użytkownika (:active - aktywacja...
- Układ wielokolumnowy CSS / Odstęp kolumn {column-gap}
...odstęp, należy podać wartość normal. Sąsiadujące kolumny z tekstem nie powinny do siebie bezpośrednio przylegać, gdyż wywołałoby to zlewanie się tekstu na krawędzi kolumn. Temu nieprzyjemnemu efektowi może skutecznie zapobiegać przerwa między kolumnami. Warto mieć na uwadze, że wartość domyślna tego odstępu (normal) zależy od konkretnej przeglądarki i wcale nie musi być równa zero. W obecnej wersji specyfikacja CSS nie pozwala ustalać różnego odstępu kolumn tego samego elementu. Przykład...
- Układ wielokolumnowy CSS / Przełamanie kolumny {break-before, break-inside, break-after}
...sekcji, czyli np. zaraz po poziomej linii: hr { break-after: column } Wreszcie w pewnych przypadkach może nam zależeć, aby wybrany fragment tekstu - np. akapit - nigdy nie został przełamany do następnej kolumny: p { break-inside: avoid-column } Przykład {break-after} To jest przykładowa treść, ułożona w wielu sąsiadujących kolumnach. break-after: column; Tekst jest automatycznie przenoszony z końca jednej kolumny na początek sąsiedniej, leżącej po jej prawej stronie... To jest...
- Układ wielokolumnowy CSS / Wypełnienie kolumn {column-fill}
...elementu (ma sens tylko, jeśli jednocześnie określimy wysokość elementu, który zawiera kolumny) Przeglądarka stara się zawsze zrównoważyć kolumny tekstu w taki sposób, aby możliwie wszystkie (oprócz ostatniej) miały taką samą wysokość i nie było żadnej wolnej przestrzeni z prawej strony elementu. Oznacza to, że nawet jeśli ustalimy wysokość elementu, kolumny mogą być od niej niższe, jeśli treści nie będzie wystarczająco dużo, aby wypełnić cały element nie tylko na szerokość, ale i na...
- Układ elastyczny CSS / Flexbox
...bloków były z góry znane. W praktyce z taką sytuacją rzadko mamy do czynienia, gdyż nie jesteśmy w stanie od razu dokładnie przewidzieć, ile tekstu będą zawierać artykuły, opublikowane w serwisie. Rozwiązaniem miało być płynne ustalanie pozycji przy pomocy właściwości float [zobacz: Szablon strony na DIV-ach]. I rzeczywiście w większości typowych zastosowań taki sposób był zupełnie wystarczający. Niestety w pewnych szczególnych przypadkach miał podobne ograniczenia jak pozycja...