menu html - Kurs HTML i CSS
Menu rozwijane, otwierane, wysuwane / Kolekcje dokumentów...jest dość długi, dzieli się go na osobne części, dzięki czemu czytelnik nie będzie musiał wczytywać całego tekstu od razu. W takim przypadku w menu umieszcza się najczęściej link tylko do pierwszej części artykułu, a na końcu treści wstawia nawigację stronicującą. Niestety ponieważ adres URL każdej kolejnej części podzielonego artykułu jest różny, właściwa gałąź menu zostanie otwarta i link zaznaczony tylko na pierwszej ze stron. Jeżeli jednak poinformujemy skrypt, które adresy wchodzą w...
HTML5 / Główna treść <main>...Strony internetowe nie są zwyczajnymi dokumentami elektronicznymi. Z racji na naturę hipertekstu w każdym serwisie WWW możemy wyznaczyć menu nawigacyjne, nagłówek witryny zwykle z osadzonym logo, stopkę zawierającą np. informacje o prawach autorskich. Wszystkie te elementy niezwykle ułatwiają przeglądanie witryny. Jednak użytkownicy odwiedzają stronę przede wszystkim nie po to, żeby oglądać menu czy logo. Głównym celem jest dotarcie do treści, która jest zawarta w serwisie. Taka...
Menu w CSS / Menu z nagłówkamiChoć wykonanie menu w oparciu o listę daje naprawdę duże możliwości, to powstaje mały problem, jeśli przed blokiem ma się wyświetlić nagłówek w formie tytułu działu. Istnieje inny element, który zapewnia taki podział pozycji - lista definicyjna (słownik). Specyfikacja HTML 4.01 podaje alternatywne zastosowania tego znacznika - np. do przedstawiania dialogu. Można zatem przyjąć, że lista definicyjna reprezentuje pozycje połączone ze sobą w taki sposób, że zawartość <dd>...</dd> stanowi...
- Rozwijane menu
Wykorzystując element <select>...</select> można stworzyć rozwijane menu, które działa w ten sposób, że po wyborze konkretnej opcji z listy, następuje wczytanie określonej strony (podobnie jak w przypadku odsyłaczy). Może to być przydatne np. jeżeli chcemy zaoszczędzić trochę miejsca na stronie (lista rozwijalna zajmuje tylko jedną linijkę). Ale uwaga! Jeśli przeglądarka użytkownika nie będzie obsługiwać skryptów JavaScript, strony z takiego menu będą niedostępne. Dlatego zaleca się umieścić w...
- Menu rozwijane, otwierane, wysuwane / Menu wielopoziomowe
Prezentowany skrypt obsługuje również wielopoziomowe struktury menu. Zasada zagnieżdżania polega na zbudowaniu najpierw pierwszego, płaskiego poziomu, a następnie wybraniu określonego elementu <dd>...</dd> i umieszczeniu w nim podrzędnej listy <dl>...</dl>, ze swoimi nagłówkami <dt>...</dt> i elementami <dd>...</dd>. Oczywiście ilość poziomów zagnieżdżenia nie jest niczym ograniczona. W celu osadzenia wielopoziomowego menu, należy powtórzyć wszystkie przedstawione wcześniej kroki. Zmianie...
- Komendy HTML 4.01 / Wykaz atrybutów
Atrybut Zastosowanie Opis abbr TD, TH Skrót dla komórki nagłówkowej tabeli accept FORM, INPUT Lista typów MIME dla wysyłanego pliku accept-charset FORM Lista obsługiwanych znaków accesskey A, AREA, BUTTON, INPUT, LABEL, LEGEND, TEXTAREA Znak klawisza dostępu action FORM (wymagany) Obsługa formularza po stronie serwera align APPLET, IFRAME, IMG, INPUT, OBJECT Pionowe lub poziome ustawienie align CAPTION Ustawienie nagłówka tabeli align COL, COLGROUP...
- Podcast HTML / #9 HTML5
...związany jest tytuł strony. Służy jedynie do grupowania - nie tworzy nowej sekcji. <nav>: sekcja strony zawierająca odnośniki nawigacyjne (np. menu główne). Inne ważne elementy semantyki: <figure> i <figcaption>: służą do oznaczania załączników (ilustracji, diagramów, kodu źródłowego) i dodawania do nich podpisów. <mark>: służy do zaznaczenia lub uwydatnienia tekstu w określonym kontekście, np. w wynikach wyszukiwania. <time>: poprawnie oznacza datę i/lub czas, często używany z...
- HTML5 / Szablon strony w HTML5
...strony w sposób jeszcze bardziej semantyczny. Spróbujmy to wykonać, przekształcając kod podany w rozdziale: Szablon strony na DIV-ach. <!doctype html> <html> <head> <meta charset="UTF-8"> <title>...</title> </head> <body> <div id="top"> <header id="NAGLOWEK">Nagłówek szablonu</heade> <nav id="MENU">Menu nawigacyjne</nav> <aside id="INFORMACJE">Dodatkowe informacje</aside> <article id="TRESC">Treść strony</article> <footer id="STOPKA">Stopka serwisu</footer>...
- HTML dla zielonych / Odsyłacz obrazkowy HTML <a href, img src alt "border">
Wszystkie odsyłacze przedstawione do tej pory, miały postać tekstową. Jeśli chcesz umieścić w swoim serwisie np. menu z obrazkowymi przyciskami, należy w tym celu użyć następującego polecenia: <a href="adres"><img src="Tu podaj względną ścieżkę dostępu do obrazka" alt="Tu podaj tekst alternatywny" style="border: 0"></a> gdzie jako "adres" można podać: względną ścieżkę dostępu do dowolnej podstrony Twojego serwisu (np.: index.html), adres internetowy poprzedzony przez "http://" lub...
- HTML5 / Kategorie elementów HTML5
W języku HTML5 elementy zostały zaklasyfikowane do wyznaczonych kategorii, które grupują znaczniki o podobnych cechach. Jeden element może należeć do wielu kategorii jednocześnie, ale niektóre znaczniki nie należą do żadnej. Kategorie pozwalają od razu domyślić się, do czego służy wybrany element, jakie znaczniki może w sobie zawierać oraz wewnątrz których elementów powinien się znajdować. Kategorie zawartości są ze sobą powiązane w następujący sposób (niektóre elementy mogą należeć również do...