Szukaj na tym blogu

HTML

Timothy Berners-Lee - twórca WWW (i nie tylko)
HTML
(ang. HyperText Markup Language) – hipertekstowy język znaczników zatwierdzany jako standard, zwany rekomendacją, przez W3C (ang. World Wide Web Consortium), zawierającą miedzy innymi wykaz elementów i atrybutów (oraz ich wartości) stosowanych w danej wersji języka.
Tematy:
  1. Wstęp
  2. Struktura strony
  3. Elementy blokowe
  4. Elementy liniowe
    Sprawdzian 1.
  5. Grafika
  6. Multimedia
  7. Linki
  8. Tabele
  9. Formularze
    Sprawdzian 2.
  10. Skrypty
  11. Suplement

Zadania):

WSTĘP

Znaczniki

  • <nazwa_elementu> - otwierający, początkowy
  • </nazwa_elementu> - zamykający, końcowy
  • <nazwa_elementu/> - pojedynczy
Znacznik (element) pojedynczy możemy zapisywać bez ukośnika /.

Elementy

  • Element
    <nazwa_elementu>zawartość elementu</nazwa_elementu>
  • Element pusty
    <nazwa_elementu/>

Atrybuty

Atrybut umieszczamy w znaczniku:
  •  otwierającym
    <nazwa_elementu nazwa_atrybutu="wartość">
    zawartość elementu
    </nazwa_elementu>
  • lub pojedynczym
    <nazwa_elementu nazwa_atrybutu="wartość"/>
Kolejne atrybuty umieszczamy po spacji.

Więcej na:

Część 1. HIPERTEKST

Część 2. MULTIMEDIA, LINKI, TABELE, FORMULARZE, SKRYPTY

Przykład 2.

Obrazy

  • <img src alt height width> - obraz (wymagany atrybuty to src - adres pliku obrazu i alt - definiujący tekst alternatywny, atrybuty height width - odpowiednio wysokość i szerokość obrazu, zalecane, wartością jest liczba z jednostką, domyślnie px, mogą być poddawane wartości procentowe %)
  • <area shape> - mapa obrazu, atrybut shape określa typ obszaru (np. wartości: rect, poly, circle - definiują obszar: prostokąt, wielokąt, koło)
Więcej na:
Karta http://plotkarka.eu/KP/obrazy.html
Plansza http://plotkarka.eu/PI/html5/obrazy.html

Multimedia

  • <video> - film (atrybut który włącza tryb odtwarzania w kółko to loop)
  • <object> - umożliwiała dodawanie animacji FLASH (z rozszerzeniem .swf)
  • <link href rel type> - link - umożliwia np. dołączenie arkusza styli, ikony strony. Atrybut href - określa adres zasobu,rel - określa typ relacji, type - określa typ.
Więcej na:
Karta https://plotkarka.eu/KP/linki.html
Plansza https://plotkarka.eu/PI/html5/linki.html

Tabele

  • <table border> - tabela (atrybut border o wartości 1 oznacza że będzie widoczne obramowanie), 
  • <td colspan rowspan> - komórka tabeli (colspan, rowspan - atrybuty scalania komórek w poziomie i pionie, wartością jest liczba oznaczająca ilość scalanych komórek), 
  • <th colspan rowspan> - komórka tabeli wyróżniona,  (colspan, rowspan - j.w), 
  • <tr> - wiersz tabeli.
  • <form> - formularz, 
  • <button> - przycisk
  • <input type name disabled checked> - pola formularza, atrybut type określa typ pola np. button, chechbox, number, radio, reset, submit, text; atrybut name - nazwę,  atrybut disabled - aktywny, atrybut checked - zaznaczony, 
  • <option> - opcja w liście rozwijalnej, 
  • <select> - lista rozwijalna (atrybut multiple - umożliwia zaznaczenia kilku opcji jednocześnie), 
  • <textarea> - pole tekstowe (wielowierszowe).

XHTML

  • Język kodowania stron internetowych, w którym należy stosować zasady języka XML (obowiązkowo zamyka się pojedyncze znaczniki np. <br/>, atrybuty logiczne wymagają wartości np. disabled="disabled"). 
Zadania:

    HTML 4


    Elementy przestarzałe:
    • big - powiększenie, 
    • font - font, 
    • strike - przekreślenie.
    Atrybuty przestarzałe:
    • bgcolor - kolor tła, 
    • color - kolor tekstu, 
    • face - nazwa fontu.
    Kodowanie polskich znaków:
    • Kodowanie ISO-8859-2 (pliku strony) stosowane w celu poprawnego wyświetlania znaków narodowych (np. , ć, ń, ó, ą) jest zgodne z polską normą ale zaleca się stosowanie międzynarodowego standardu UTF-8.
    Zadania:

    Więcej na:

    ŹRÓDŁA

    [HTML5.2]
    HTML5.2; W3C Recommendation, 14 December 2017;
    URL: https://www.w3.org/TR/html52/
    Aktualizacja
    Etykiety: , , , ,