html nagłówek treści - Kurs HTML i CSS
HTML5 / Nowe elementy HTML5...Sekcje Sekcje to odrębne tematycznie fragmenty treści na stronie. Można je porównać do rozdziałów w książce. Każda sekcja może mieć nagłówek (tytuł rozdziału) i stopkę (zawierającą informacje o autorze, prawach autorskich itp.). W ramach znaczników przydatnych przy wstawianiu sekcji, wyróżnić możemy elementy, które fizycznie te sekcje tworzą (ang. sectioning elements) - są to: ARTICLE, ASIDE, NAV, SECTION. Definiują one w dokumencie zakres dla stopek sekcji (element FOOTER)...
- Podcast HTML / #7 Widżety HTML
...ramek po kliknięciu odnośnika, należy użyć kodu JavaScript: <a href="javascript:void(0)" onclick="parent.nazwaramki1.location.href = 'adres1.html'; parent.nazwaramki2.location.href = 'adres2.html'; return false">...</a> "nazwaramki1" i "nazwaramki2" to wartości atrybutów name="..." nadane znacznikom <iframe>. W niektórych przypadkach zamiast parent.nazwaramki trzeba użyć top.nazwaramki albo self.nazwaramki. Możliwe jest załadowanie więcej niż dwóch ramek poprzez dodanie kolejnych...
Szablon strony na DIV-ach / Płynny szablon...Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Treść strony... Stopka serwisu html, body { background-color: #fff; color: #000; margin: 0; padding: 0; } #NAGLOWEK { background-color: #888; } #MENU { width: 150px; float: left; overflow: hidden; position: relative; background-color: #ccc; } #TRESC { margin-left: 150px; background-color: #fff; } #STOPKA { clear: both; background-color: #888; } Wyjaśnienie...
- Szablon strony na DIV-ach / Stały szablon
...przykłady w skali 1:2, czyli dwukrotnie pomniejszone): Dwie kolumny: Nagłówek szablonu Menu nawigacyjne Treść strony Stopka serwisu html, body { background-color: #fff; color: #000; margin: 0; padding: 0; text-align: center; } #top { width: 780px; margin-left: auto; margin-right: auto; text-align: left; } #NAGLOWEK { background-color: #888; } #MENU { width: 150px; float: left; overflow: hidden; background-color: #ccc; } #TRESC { width: 630px; float: left...
- Widżety HTML / Szablon strony bez ramek
...Rozwiązaniem tego problemu mogłyby być ramki lokalne (<iframe>...</iframe>). W takim przypadku teoretycznie można stworzyć jedną stronę index.html, na której umieszcza się menu i inne stałe elementy, a w miejsce właściwej treści strony wstawia się ramkę lokalną, gdzie wczytuje się zawartość poszczególnych podstron. Taki sposób niestety posiada poważną wadę: na pasku adresu przeglądarki wyświetla się cały czas taki sam adres. Powoduje to problemy z dodaniem wybranej podstrony do...
Dla nauczycieli / Scenariusz lekcji informatyki dla liceum i technikum...10 min - Ćwiczenie praktyczne: utworzenie strony z tytułem, nagłówkami, akapitem i odsyłaczem Uczniowie tworzą dokument HTML zawierający: tytuł, nagłówek, akapit z tekstem, odsyłacz do zewnętrznej strony. Używają interaktywnego edytora lub osobnego edytora HTML, aby wprowadzić zmiany i wyświetlić stronę w przeglądarce. 5 min - Omówienie błędów, wspólna analiza kodu Nauczyciel analizuje błędy popełnione przez uczniów, wyjaśnia je i udziela wskazówek, jak je poprawić. 5 min - Zadanie...
- Szablon strony na DIV-ach / Semantyczny szablon strony
...Zwykle daje się łatwo rozpoznać, czy w określonym przypadku powinno się użyć tabeli: W prezentowanych danych można wyróżnić poziomy lub/i pionowy nagłówek - może go nawet nie być, ważne żeby dało się go logicznie wyznaczyć choćby wirtualnie. Prezentujemy przynajmniej dwa egzemplarze krótkich danych o podobnym charakterze - będą to odpowiedniki kolejnych wierszy tabeli. Taka tabela może mieć nawet tylko jedną kolumnę danych (w takim przypadku zwykle mamy do czynienia z pionowym nagłówkiem...
- Dobre praktyki / Przykazania webmastera
...przeglądarki. Jeśli dodatkowo zmiany dotyczyły również kodu HTML, mamy gotowy przepis na zupełne rozsypanie się wyglądu strony. Ponieważ pliki *.html zwykle cache'ują się słabiej (na krótszy czas), może dojść do sytuacji, kiedy użytkownicy dostaną już nową wersję kodu źródłowego HTML, która wymaga jednak zmienionego właśnie arkusza CSS, ale sam arkusz zaczyta się stary - z pamięci podręcznej przeglądarki. Aby do tego nie dopuścić, zawsze można wprowadzić na serwer po prostu nowy plik...
- Tabele HTML / Komórki nagłówkowe tabeli <th>
...nie tylko w pierwszym. Dodatkowo w wierszu takim mogą się znajdować również inne zwykłe komórki <td>...</td>. Dzięki temu możemy stworzyć pionowy nagłówek, znajdujący się np. na lewym brzegu tabeli. Chociaż identyczny efekt wizualny można uzyskać odpowiednio zmieniając wygląd zwykłych komórek tabeli (<td align="center"><b>...</b></td>), to absolutnie taka metoda nie jest zalecana. Komórki nagłówkowe <th>...</th> oprócz efektu wizualnego niosą ze sobą ważne znaczenie semantyczne...
Menu rozwijane, otwierane, wysuwane / Skrypt menu rozwijanego, otwieranego, wysuwanego...swoim edytorze HTML nowy dokument. Wklej do niego poniższy kod i zapisz w pliku menu.js: /** * @author Sławomir Kokłowski {@link https://www.kurshtml.edu.pl} * @copyright NIE usuwaj tego komentarza! (Do NOT remove this comment!) */ function Menu(id, style, otworz, wysun, czasRozwin, czasZwin, czasOtworz, czasZamknij, nieInicjalizuj) { if (typeof czasRozwin == 'undefined' || czasRozwin < 0) czasRozwin = 25; if (typeof czasZwin == 'undefined' || czasZwin < 0) czasZwin = 25; if...