ramki - Kurs HTML i CSS
Menu rozwijane, otwierane, wysuwane / Menu wysuwaneNormalnie pozycje menu są rozwijane począwszy od pierwszej do ostatniej, a zwijane od ostatniej do pierwszej. Można odwrócić te kolejności, dzięki czemu uzyskamy efekt wysuwania: <script> new Menu('menu0', '', false, true); </script> Przykład HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje Wstawianie stylów Skrypty Aktywne przyciski Aktualizacja Nowe okno
Komendy HTML 4.01 / IMG...po prawej top - na górze ALT="tekst" Tekst alternatywny, używany przez przeglądarki, które nie wyświetlają obrazków BORDER="piksele" Szerokość ramki elementu w pikselach (zdeprecjonowane) CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami DIR="kierunek" Kierunek tekstu: ltr - od lewej do prawej rtl - od prawej do lewej HEIGHT="długość" Wysokość w pikselach lub w procentach HSPACE="piksele" Odstęp po lewej i prawej...
- Komendy HTML 4.01 / OBJECT
...archiwów rozdzielonych spacjami, które zawierają zasoby związane z obiektem (podane w atrybutach CLASSID i DATA) BORDER="piksele" Szerokość ramki elementu w pikselach (zdeprecjonowane) CLASS="klasa" Przypisuje nazwę klasy (CSS) lub nazwy klas do elementu, które muszą być rozdzielone białymi znakami CLASSID="adres" Lokalizacja implementacji obiektu CODEBASE="adres" Określa adres bazoway, używany do tworzenia adresów względnych, podawanych w atrybutach CLASSID, DATA i ARCHIVE...
Obramowanie CSS / Obcięcie obramowania obrazkowego {border-image-slice}...względem wymiarów grafiki). Dodatkowo na końcu wartości obcięcia po znaku spacji można dopisać słowo kluczowe fill. Oznacza ono, że środek ramki również zostanie wypełniony grafiką - powieloną ze środkowego prostokąta siatki obrazka obramowania. Przykładowo, podając deklarację "border-image-slice: 25% 30% 12% 20%", uzyskamy następującą siatkę obcięć: Źródło: CSS Backgrounds and Borders Module Level 3 Przykład {border-image-slice} border-image-source: url(punkt.gif)...
- Obramowanie CSS / Atrybuty mieszane obramowania {border}
Spis treści {border} Atrybuty mieszane obramowania {border} Podkreślenie tekstu Zagnieżdżanie obramowania Atrybuty mieszane obramowania {border} Atrybuty mieszane górnego obramowania: selektor { border-top: wartości atrybutów } Atrybuty mieszane dolnego obramowania: selektor { border-bottom: wartości atrybutów } Atrybuty mieszane lewego obramowania: selektor { border-left: wartości atrybutów } Atrybuty mieszane prawego obramowania: selektor { border-right: wartości atrybutów }...
- Pozycjonowanie CSS / Pozycja absolutna {position: absolute}
...pozycjonowania absolutnego (bezwzględnego) pozwala przesunąć wybrany element w dowolną stronę względem wybranych brzegów strony lub ewentualnie ramki albo "obejmującego bloku" (opis powyżej). Dzięki temu dany element będzie umieszczony tam na "sztywno", bez względu na miejsce, w którym wpisaliśmy polecenie pozycjonowania absolutnego. Jeżeli jako "wartość" wpiszemy liczbę ujemną, element znajdzie się częściowo lub całkowicie poza obrębem strony lub wyjdzie poza krawędzie "obejmującego...
- Komendy CSS3 / Podstawowy interfejs użytkownika CSS
...vertical Inicjalizacja none Zastosowanie elementy z przepełnieniem innym niż visible i opcjonalnie elementy zastępowane takie jak obrazki, wideo, ramki lokalne Dziedziczenie nie Procenty nie Media visual text-overflow Przepełnienie tekstu Wartość clip | ellipsis Inicjalizacja clip Zastosowanie elementy blokowe Dziedziczenie nie Procenty nie Media visual
- Indeks, wyszukiwarka / Wyszukiwarka
...jak podany w pliku indeks_hasla.js adres Lokalizacja dokumentu HTML, w którym został umieszczony indeks z hasłami Można również podać nazwę ramki lub wymusić otwieranie wyników z wyszukiwarki w nowym oknie - dokładnie jak w pliku indeks_hasla.js: <script> var indeks = new Indeks('indeks', ramka); indeks.wstawWyszukiwarke('adres'); </script> lub <script> var indeks = new Indeks('indeks', 'nazwaokna'); indeks.wstawWyszukiwarke('adres'); </script> Przykład Demonstrację działania...
- Rozwijane menu
...Można również zaznaczyć opcję domyślną (atrybut selected), aby wskazać która strona jest aktualnie wczytana. Jeśli chcemy wczytać dokument do innej ramki, to w wartości atrybutu onchange="..." zamiast self należy wpisać: parent.nazwaramki, top.nazwaramki albo self.nazwaramki. Przykład Wybierz stronę do wczytania: Rozwijane menu HTML dla "zielonych" Znaczniki BODY i META Tekst Odsyłacze
- Menu rozwijane, otwierane, wysuwane / Czas rozwijania/zwijania
Aby przyspieszyć lub zwolnić rozwijanie/zwijanie pozycji menu, należy powtórzyć wszystkie przedstawione kroki, poza ostatnim (wywołanie skryptu), który tym razem należy wykonać następująco: <script> new Menu('menu0', '', false, false, czasRozwin, czasZwin); </script> czasRozwin Czas w milisekundach (1 s = 1000 ms), w którym następuje rozwinięcie pojedynczego elementu menu (<dd>...</dd>). Aby wymusić natychmiastowe rozwinięcie wszystkich elementów, należy podać wartość 0 (zero). czasZwin...