ramki - Kurs HTML i CSS
- 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...
- Menu rozwijane, otwierane, wysuwane / Menu otwierane
Spis treści Menu otwierane Opóźnienie przy otwieraniu/zamykaniu Menu otwierane Czasem przydatne jest wstawienie menu, które otwiera się po wskazaniu nagłówka myszką, a chowa automatycznie po usunięciu wskaźnika myszki z obrębu wybranego fragmentu menu. <script> new Menu('menu0', '', true); </script> Przykład Wskaż poniższe nagłówki menu myszką: HTML Dla zielonych BODY i META Tekst Odsyłacze Tabele Multimedia Ramki Formularze CSS Kaskadowe Arkusze Stylów Definicje...
- Menu rozwijane, otwierane, wysuwane / Pozycja absolutna
Spis treści Pozycja absolutna Inicjalizacja Menu otwierane Szczególnie dla menu otwieranego dość nieprzyjemną 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...
- Menu rozwijane, otwierane, wysuwane / Łączenie opcji
Wszystkie z przedstawionych powyżej opcji można ze sobą łączyć, uzyskując w ten sposób dodatkowy efekt, np. następujące wywołanie skryptu: <script> new Menu('menu0', 'position: absolute', true, true, 0, 100, 0, 250); </script> spowoduje osadzenie wypozycjonowanego absolutnie menu otwieranego w wersji wysuwanej ze zmodyfikowanymi czasami rozwijania/zwijania oraz opóźnieniem przy otwieraniu i zamykaniu. Aby pominąć określenie pozycji, należy po prostu wpisać '' (dwa apostrofy). Aby pominąć...