Elementy HTML5 - Różne tagi HTML z ich zastosowaniami i przykładami

Spisie treści:

Anonim

Wprowadzenie do elementów HTML5

Jesteśmy głównie świadomi stron internetowych. Witryna internetowa to po prostu zbiór stron internetowych. Aby utworzyć dowolną stronę internetową, której potrzebujemy. HTML to element odpowiedzialny za tworzenie dowolnej strony internetowej. HTML oznacza HyperText Markup Language. Jest to podstawowy język znaczników używany do tworzenia stron internetowych, które dodatkowo składają się na tworzenie stron internetowych. HTML ewoluował tak bardzo od początkowego etapu, w którym został utworzony

HTML został pierwotnie opracowany przez W3C i WHATWG. Został pierwotnie opracowany w 1993 roku. W3C sprawdza głównie standardy HTML i innych rzeczy. HTML bardzo ewoluował od początkowej wersji 1.0 do wersji 5 HTML5 ma wiele nowych znaczników HTML.

Tagi HTML, tam zastosowania i przykłady

Poniżej znajdują się niektóre tagi HTML z ich zastosowaniem, a przykłady są następujące:

Nowe elementy w HTML5

1) - Jest to nowy element formularza w HTML5. Pomaga zaimplementować funkcję autouzupełniania, w której pojawia się pole wprowadzania, w którym użytkownik może wstawić tekst, aby zobaczyć elementy na liście

Przykład:










Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

- Ten znacznik reprezentuje wynik każdego obliczenia obliczonego na pliku HTML

Przykład



0
100
+
=

Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

2) - Ten element służy do odbierania danych wejściowych od użytkownika. Tekst wprowadzony przez użytkownika ma zazwyczaj formę tekstową

Przykład




Favorite Football Player:

Favorite Football Team:


Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

3) - Ten element służy do otrzymania hasła od użytkownika.

Przykład



User name

Password:


Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

4) - Ten tag wyświetla przycisk przesyłania. Ten przycisk służy do przesłania formularza

Przykład - w poniższym przykładzie zaktualizuj wartość akcji ze ścieżką do pliku php




Favorite Football Player:

Favorite Football Team:


Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

5) - Ten element pomaga uzyskać jedno wejście od użytkownika z dostępnych wielu elementów. Użytkownik może wybrać dowolny z elementów dostępnych na liście

Przykład



Radio Buttons for faavorite cusine
Asian
Thai
Japanese




Radio Buttons for faavorite cusine
Asian
Thai
Japanese




Radio Buttons for faavorite cusine
Asian
Thai
Japanese


Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

6) - Ten element pomaga uzyskać wiele danych wejściowych od użytkownika z dostępnych wielu elementów. Użytkownik może wybrać dowolną liczbę pozycji dostępnych na liście

Przykład



Checkbox for faavorite cusine
Asian
Thai
Japanese




Checkbox for faavorite cusine
Asian
Thai
Japanese




Checkbox for faavorite cusine
Asian
Thai
Japanese


Teraz skopiuj powyższy fragment kodu i wklej go w pliku HTML. Teraz otwórz plik w przeglądarce

7) HTML put type = ”number”> - Ten element pomaga uzyskać wartość liczbową od użytkownika. Użytkownik może wstawić tylko wartość liczbową w polu

Przykład



Number fields example
Enter number




Number fields example
Enter number




Number fields example
Enter number


Teraz skopiuj powyższy fragment kodu i wklej go do pliku HTML. Teraz otwórz plik w przeglądarce

8) - Ten element pomaga sprawdzić, czy wartość wstawiona przez użytkownika jest prawidłowym adresem e-mail. Pokazuje błąd przy wysyłaniu, jeśli e-mail jest nieprawidłowy

Przykład



Number fields example
Enter valid email id




Number fields example
Enter valid email id




Number fields example
Enter valid email id


Teraz skopiuj powyższy fragment kodu i wklej go w pliku HTML. Teraz otwórz plik w przeglądarce

Poza tym do HTML5 dodano wiele nowych elementów. Niektórzy z nich są -

  • zasięg
  • URL
  • tel
  • audio
  • osadzać

Oprócz elementów HTML. Dodano również nowe elementy semantyczne. Niektóre ważne elementy semantyczne to-

    Wniosek - elementy HTML5

    Obecnie opracowywanych jest wiele tagów HTML%. Od początkowej wersji 1.0 do najnowszej wersji 5.2 HTML bardzo się rozwinął. Te znaczniki pomagają zapewnić lepszy interfejs dla użytkownika, a także zapewniają kilka sprawdzeń poprawności na samym komputerze użytkownika.

    Polecane artykuły

    To był przewodnik po elementach HTML5. Tutaj omawiamy wprowadzenie, tagi HTML, jego zastosowania i odpowiadające im przykłady. Możesz także przejrzeć nasze inne sugerowane artykuły, aby dowiedzieć się więcej -

    1. HTML5 vs HTML4
    2. HTML vs HTML5
    3. Wywiad HTML5 Pytania i odpowiedzi
    4. 10 najlepszych różnic między HTML a HTML5 (infografiki)
    5. Ramki HTML
    6. HTML5 Nowe elementy
    7. Tagi HTML5 | 4 najlepsze tagi HTML5 | Przykłady
    8. Przewodnik po elementach semantycznych HTML5