blok - Kurs HTML i CSS
Komendy HTML 4.01 / DIV...onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup Znacznik otwierający: wymagany Znacznik zamykający: wymagany Wyświetlanie: w bloku
Wstawianie stylów CSS / Wydzielone bloki <div style>...(opisane w kolejnych rozdziałach). Natomiast jako wyraz "wartość" wpisujemy dokładną wartość atrybutu. Fragment dokumentu wydzielony za pomocą bloku <div>...</div> możemy swobodnie formatować. Element ten tak dobrze nadaje się do osadzania stylów, ponieważ sam w sobie nie ma określonego żadnego formatowania, które mogłoby kolidować z efektem, jaki chcemy uzyskać. Metoda ta jest bardzo podobna do SPAN, lecz obejmuje zwykle większe fragmenty dokumentu (może zawierać w sobie różne znaczniki...
- Selektory pseudoelementów CSS / Pierwsza litera :first-letter
selektor:first-letter { cecha: wartość } Selektorem może być dowolny znacznik wyświetlany w bloku [zobacz: Wstawianie stylów]. Natomiast wyrazy "cecha" oraz "wartość" określają atrybuty elementu nadane poprzez style i zostaną opisane w dalszych rozdziałach. Aby selektor zadziałał, blok musi się rozpoczynać tekstem, a nie np. obrazkiem ani tabelką. Polecenie pozwala na nadanie określonych cech pierwszej literze treści, znajdującej się wewnątrz znacznika, na który wskazuje selektor. UWAGA...
- Selektory pseudoelementów CSS / Cudzysłowy {quotes}
...Opera) W języku HTML istnieją specjalne znaczniki, przeznaczone do oznaczania cytatów: <q>...</q> (krótki cytat), <blockquote>...</blockquote> (blok cytowany). Jak mówi specyfikacja HTML 4.01, cytatów wstawianych w elementach q nie należy 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żą...
- Obramowanie CSS / Dekoracja przełamania obramowania {box-decoration-break}
...miał osobne obramowanie slice - wszystkie fragmenty przełamanego elementu będą miały wspólne obramowanie (domyślnie) Zdarza się, że na wydruku blok zostanie przełamany pomiędzy dwie kartki w taki sposób, że jego początek znajdzie się na końcu jednej strony, a koniec - na samym początku następnej. W takim przypadku standardowo na dole pierwszego fragmentu ani na górze drugiego nie będzie obramowania. Podobnie jeśli obramowanie zostanie przypisane do długiego elementu wyświetlanego w...
- Jednostki CSS / Długość
...języku HTML korzeniem jest zawsze element <html> Jednostka rem może być przydatna w sytuacji, kiedy chcemy, aby definiowana długość (np. szerokość bloku na stronie) odnosiła się do określonego rozmiaru czcionki, ale jednocześnie chcemy ją uniezależnić od wartości wyliczonych zgodnie z zasadą dziedziczenia stylów. Przykładowo załóżmy, że wysokość czcionki korzenia (element <html>) wynosi 16px, a dla <body> ustalono "font-size: 2em". Jeżeli teraz na stronie wstawimy blok ze stylem "width...
- Układ wielokolumnowy CSS / Szerokość kolumny {column-width}
...Internet Explorer 10, Firefox 52, Opera 11-12 i 37, Chrome 50) selektor { column-width: szerokość } Selektorem może być dowolny element blokowy z wyjątkiem tabel [zobacz: Wstawianie stylów]. Szerokość jest wyrażona w jednostkach długości i musi być większa od zera. Aby usunąć kolumny lub pozwolić przeglądarce wyznaczyć ich szerokość w inny sposób, należy podać wartość auto. Ustalając szerokość kolumn pozwalamy przeglądarce automatycznie wyświetlić tyle kolumn, ile będzie...
Menu rozwijane, otwierane, wysuwane / Menu wielopoziomowe...W celu osadzenia wielopoziomowego menu, należy powtórzyć wszystkie przedstawione wcześniej kroki. Zmianie ulegnie tylko kod HTML tworzący sam blok menu: <dl id="menu0"> <dt>Nagłówek 1</dt> <dd> <dl> <dt>Nagłówek 1.1</dt> <dd> <dl> <dt>Nagłówek 1.1.1</dt> <dd>Element 1.1.1.1</dd> <dd>Element 1.1.1.2</dd> <dd>Element 1.1.1.3</dd> <dt>Nagłówek 1.1.2</dt> <dd>Element 1.1.2.1</dd> <dd>Element 1.1.2.2</dd> <dd>Element 1.1.2.3</dd> </dl> </dd>...
- Menu rozwijane, otwierane, wysuwane / Pozycja absolutna
...właściwością jest fakt, że przy jego rozwijaniu elementy poniżej są przesuwane w dół. Można temu zapobiec określając odpowiednią pozycję absolutną bloku. Oczywiście można to zrobić bezpośrednio dodając odpowiednie deklaracje CSS. Jednak trzeba przewidzieć, co się stanie, jeśli przeglądarka użytkownika nie będzie obsługiwać JavaScript. Samo menu nadal będzie funkcjonalne pod względem nawigacji, tzn. jego elementy (odsyłacze) będą dostępne, ale oczywiście funkcja rozwijania nie będzie działać...
- Menu rozwijane, otwierane, wysuwane / Wygląd menu rozwijanego, otwieranego, wysuwanego
...border-left: 1px solid #eee; border-right: 1px solid #aaa; } Aby ustawić kolejne menu otwierane obok siebie, należy wstawić kilka osobnych bloków <dl>...</dl>, a następnie wypozycjonować je w odpowiednim miejscu względem siebie: HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze new Menu('menu9', 'position: absolute', true, true, -1, -1, -1, -1, true); CSS Kaskadowe Arkusze Stylów Definicje Wstawianie stylów new Menu('menu10...