An element in HTML consists of opening tags and closing tags. However, there are also those who don't have closing tags.
Poor too, huh 
However, this element remains valid and can be read by the browser. Elements that do not have a closing tag are also called void elements , because they do not have contents.
What are the tags that don't have that cover?
let's see ...
1. Tag <area>
The
<area>function tag is to define the area in the image map .Image map is an image that has a clickable area. Tags are <area>always inside tags <map>.
Example:
<img src="https://www.w3schools.com/tags/planets.gif" width="145" height="126" alt="Planets" usemap="#planetmap">
<map name="planetmap">
<area shape="rect" coords="0,0,82,126" alt="Sun" href="sun.htm">
<area shape="circle" coords="90,58,3" alt="Mercury" href="mercur.htm">
<area shape="circle" coords="124,58,8" alt="Venus" href="venus.htm">
</map>
The demo can be seen at: w3schools.com
2. Tag <base>
The
<base>function tag is to create the base URL and target for a relative link. Example of its use:<!DOCTYPE html>
<html>
<head>
<base href="https://www.w3schools.com/images/" target="_blank">
</head>
<body>
<p><img src="stickman.gif" width="24" height="39" alt="Stickman"> - Notice that we have only specified a relative address for the image. Since we have specified a base URL in the head section, the browser will look for the image at "https://www.w3schools.com/images/stickman.gif".</p>
<p><a href="https://www.w3schools.com">W3Schools</a> - Notice that the link opens in a new window, even if it has no target="_blank" attribute. This is because the target attribute of the base element is set to "_blank".</p>
</body>
</html>
Note the example above, the image
stickman.gifwill be searched at the base URL address given in the tag <base>. Then, the W3Schools link will open in a new window, because the <base>target tag is already set.
3. Tag <br>
This tag functions to create a new line. Example of its use:
<p>
Langit seolah-olah menangis.<br>
Hujan waktu itu sangat berkesan.
</p>
the result:
The sky as if crying.
The rain was very memorable at that time.
The rain was very memorable at that time.
4. Tag <col>
The
<col>function tag is to give attributes to columns in the table. This tag is written in the tag <colgroup>. With <col>this tag , we do not have to create attributes for each table cell ( <td>), because it is already represented by it.
Example of use:
<table>
<colgroup>
<col span="2" style="background-color:red">
<col style="background-color:yellow">
</colgroup>
<tr>
<th>ISBN</th>
<th>Title</th>
<th>Price</th>
</tr>
<tr>
<td>3476896</td>
<td>My first HTML</td>
<td>$53</td>
</tr>
<tr>
<td>5869207</td>
<td>My first CSS</td>
<td>$49</td>
</tr>
</table>
Demo the result: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_col_test
5. Tag <embed>
The
<embed>function tag is to create containers for external applications or interactive content such as flash animation.
Example of use:
<!DOCTYPE html>
<html>
<body>
<embed src="helloworld.swf">
</body>
</html>
6. Tag <hr>
Tag
<hr>function to create a horizontal line (horizontal row) . Example of its use:<h4>Waktu itu...</h4>
<hr>
<p>Tak kusangka, hari itu bakal menjadi hari terakhirku berjumpa denganmu</p>
The result:
That time…
I never thought, that day would be my last day to meet you
7. Tag <img>
This one tag must have known many functions. Yep ... really right. its function to display images.
Example of use:
<img src="foto-si-doi.jpg">
8. Tag <input>
The
<input>function tag is to make input elements on the form. This tag has an attribute typethat will determine the type of input.
Example:
<form action="proses.php" method="POST">
<input type="text" name="username" placeholder="Username">
<input type="password" name="password" placeholder="Password">
<input type="submit" value="Masuk">
</form>
9. Tag <keygen>
The
<keygen>function tag is to create a secret key on the form. This tag is used for security.
Example of use:
<form action="/action_page.php" method="get">
Username: <input type="text" name="usr_name">
Encryption: <keygen name="security">
<input type="submit">
</form>
10. Tags <link>
Tags are
<link>used to define the relationship between HTML documents and external resources such as CSS. This tag can also be used to create a favicon .
Example of use:
<head>
<link rel="stylesheet" href="/css/style.css">
<link rel="icon" href="favicon.png">
</head>
11. Tag <meta>
Tags are
<meta>used to define the metadata of a web page.Metadata will not be displayed on a web page, but will be read by a machine or a bot (robot). For example, data will appear on search engines.
<meta>This tag is important for SEO (search engine optimization) . So, if you create a web without using tags <meta>, it's likely to be difficult to be indexed by search engines.
Examples of tag usage
<meta>:<head>
<meta charset="UTF-8">
<meta name="description" content="Web Programmer pengguna Linux">
<meta name="keywords" content="Programmer,Linux,Petanikode,Petani Kode">
<meta name="author" content="Petani Kode">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
12. Tag <param>
Tags are
<param>used to give parameters to embeded plug-insusing elements <object>.
Example:
<object data="horse.wav">
<param name="autoplay" value="true">
</object>
13. Tag <source>
Tags are
<source>used to define media file sources for <audio>and <video>.
Example:
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Browser anda tidak mendukung elemen audio.
</audio>
14. Tag <track>
Tags are
<track>used to define taks for media elements ( <audio> and <video>). Can be in the form of subtitles , captions, and other texts.
Example of use:
<video width="320" height="240" controls>
<source src="forrest_gump.mp4" type="video/mp4">
<source src="forrest_gump.ogg" type="video/ogg">
<track src="subtitles_en.vtt" kind="subtitles" srclang="en" label="English">
<track src="subtitles_no.vtt" kind="subtitles" srclang="no" label="Norwegian">
</video>
15. Tag <wbr>
WBR stands for Word Break Opportunity . This tag is almost similar to the tag
<br>. The difference, this tag does not directly create a new line like <br>.
This tag will create a new line when there is no space on the side.
Example of use:
<p>
To learn AJAX, you must be familiar with the XML<wbr>Http<wbr>Request Object.
</p>
Then later, if the screen size is narrowed, text will be displayed like this:
To learn AJAX, you must be familiar with the XML
Http
Request Object.
That's 15 HTML tags that don't have a closing pair. Then how do you close these tags, while they don't have a closing partner?
In XHTML, all elements must be closed. Well! to close these tags, we can use slashes (
/) at the end.
Example:
<br />
<hr />
Reference:
- w3.org
- w3schools.com
- https://www.petanikode.com/html-tag-tanpa-penutup/
0 Komentar untuk "15 HTML tags that do not have a closing pair"
Silahkan berkomentar sesuai artikel