Oprócz podstawowych elementów HTML, które omówiliśmy, istnieje kilka innych elementów, których można użyć do ulepszenia funkcjonalności i doświadczenia użytkownika na stronie internetowej. Przyjrzyjmy się niektórym z tych dodatkowych elementów HTML.
Dodatkowe elementy HTML
Formularze HTML
Formularze są kluczową częścią wielu witryn internetowych, umożliwiając użytkownikom wprowadzanie informacji i interakcję z witryną. Formularze HTML mogą zawierać pola wprowadzania tekstu, liczb, dat i nie tylko, a także pola wyboru, przyciski opcji i menu rozwijane. Aby utworzyć formularz, możesz użyć elementu <form> , a następnie dodać do niego różne elementy wejściowe. Możesz także użyć innych atrybutów, takich jak „działanie” i „metoda”, aby określić, gdzie i jak mają zostać przesłane dane formularza.
Ramki iframe w HTML
Ramka iframe to element HTML, który umożliwia osadzenie innego dokumentu lub strony internetowej na własnej stronie internetowej. Jest to często używane do wyświetlania treści zewnętrznych, takich jak filmy, mapy lub kanały mediów społecznościowych. Aby użyć elementu iframe, możesz użyć elementu <iframe> , a następnie określić źródłowy adres URL treści, którą chcesz osadzić. Możesz także użyć innych atrybutów, takich jak „szerokość” i „wysokość”, aby ustawić rozmiar osadzonej treści.
Audio i wideo w HTML
HTML zawiera również elementy do osadzania treści audio i wideo na stronie internetowej. Element <audio> może służyć do osadzania plików audio, a element <video> może służyć do osadzania plików wideo. Możesz także użyć innych atrybutów, takich jak „autoodtwarzanie” i „sterowanie”, aby określić sposób odtwarzania i wyświetlania multimediów.
Semantyczny HTML
Semantyczny HTML odnosi się do użycia elementów HTML, które przekazują znaczenie i strukturę treści na stronie internetowej. Obejmuje to elementy takie jak <header> , <footer> , <nav> i <article> , które pomagają uporządkować treść i uczynić ją bardziej dostępną dla użytkowników i wyszukiwarek. Korzystając z semantycznego HTML, możesz poprawić użyteczność i dostępność swojej witryny, a także jej ranking w wyszukiwarkach.
Podsumowanie
Te dodatkowe elementy HTML mogą znacznie poprawić funkcjonalność i wygodę użytkownika strony internetowej. Ucząc się, jak prawidłowo z nich korzystać, możesz tworzyć bardziej dynamiczne i angażujące strony internetowe. Podobnie jak w przypadku wszystkich podstaw HTML, ważne jest, aby ćwiczyć i eksperymentować, aby zobaczyć, co najlepiej sprawdza się w konkretnym projekcie.
Zastosowanie elementów w kodzie HTML
Oto kilka przykładów kodu HTML:
Podstawowa struktura HTML:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Heading 1</h1>
<p>This is a paragraph.</p>
</body>
</html>
Dodawanie linków w HTML:
<a href="https://www.example.com">Link Text</a>
Dodawanie obrazów w HTML:
<img src="image.jpg" alt="Image Description">
Tworzenie list w HTML:
<ul>
<li>List Item 1</li>
<li>List Item 2</li>
</ul>
<ol>
<li>List Item 1</li>
<li>List Item 2</li>
</ol>
Tworzenie formularzy w HTML:
<form action="/submit-form" method="post">
<label for="name">Name:</label>
<input type="text" id="name" name="name"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<input type="submit" value="Submit">
</form>
Dodawanie tabel w HTML:
<table>
<tr>
<th>Heading 1</th>
<th>Heading 2</th>
</tr>
<tr>
<td>Row 1, Column 1</td>
<td>Row 1, Column 2</td>
</tr>
<tr>
<td>Row 2, Column 1</td>
<td>Row 2, Column 2</td>
</tr>
</table>
