Close Elements
#HelloFront-end #HelloErmine #HelloWorld2021
Heading elements : <h>
<hn>
āđāļāđāļ tag āļāļĩāđāđāļāđāđāļāļāļēāļĢāļāļģāļŦāļāļāļāļāļēāļ content āđāļāļĒ n āđāļāđāļāļāļąāļ§āđāļĨāļ 1-7 āđāļāđāļāļģāļŦāļāļāļāļāļēāļāđāļĢāļĩāļĒāļāļāļēāļāđāļŦāļāđāđāļāđāļĨāđāļ āđāļāļĢāļēāļ°āļāļ·āļāļ§āđāļē 1 āļŠāļģāļāļąāļāļŠāļļāļāļāđāļāļāļĄāļĩāļāļāļēāļāđāļŦāļāđāļŠāļļāļ
Paragraphs : <p>
<p>
āđāļāđāđāļāļāļēāļĢāļāļąāļāļŦāļāđāļēāđāļŦāđ content āļāļĩāđāļāļĒāļđāđāļĢāļ°āļŦāļ§āđāļēāļ tag āđāļāļīāļāđāļĨāļ°āļāļīāļ āļāļĒāļđāđāđāļāđāļāļāļĨāļļāđāļĄāđāļĒāļāļāļāļāļāļēāļ content āļ āļēāļĒāļāļāļ āļāļĨāđāļēāļĒ āđ āļāļąāļāļāļēāļĢāđāļāđāļāđāļāļ·āđāļāļŦāļēāđāļāđāļāļĒāđāļāļŦāļāđāļēāđāļāđāļ block āđāļāđāļāļēāļāđāļĄāđāđāļāđāļĒāđāļāļŦāļāđāļēāđāļāđāļēāđāļāļāļĢāļīāļ āđ
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<p>This is a paragraphhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
<p>This is another paragraphhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh
hhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhhh</p>
</body>
</html>
āļāļĨāļĨāļąāļāļāđ
Preformatted sections : <pre>
<pre>
āđāļāđāļŠāļģāļŦāļĢāļąāļāļāļģāļŦāļāļāļĢāļđāļāđāļāļāļāļēāļĢāđāļŠāļāļāļāļĨāļāļāļŦāļāđāļēāđāļ§āđāļāđāļāļ āđāļāļĒāļāļļāļ content āļāļĩāđāđāļŠāļāļāļāļĨāļāļāđāļ§āđāļāđāļāļāļāļ°āļĄāļĩāļĢāļđāļāđāļāļāļāļĩāđāđāļŦāļĄāļ·āļāļāļāļąāļāļāļĩāđāđāļĢāļēāđāļāđāļāļąāļāđāļ§āđāđāļāļāļēāļĢāđāļāļĩāļĒāļ code āļĄāļąāļāđāļāđāļāļąāļāļāđāļāļāļ§āļēāļĄāļāļĩāđāđāļāđāļāļŠāļđāļāļĢāļāļēāļāļāļāļīāļāļĻāļēāļŠāļāļĢāđāđāļĨāļ°āļ§āļīāļāļĒāļēāļĻāļēāļŠāļāļĢāđ
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<pre>
<h3>āđāļāļāļēāļĢāđāļāļĨāļĩāđāļĒāļāđāļāļĨāļāļŦāļāđāļ§āļĒāļ§āļąāļāļāļļāļāļŦāļ āļđāļĄāļīāļāļēāļāļŦāļāđāļ§āļĒāļŦāļāļķāđāļāđāļāļĒāļąāļāļāļĩāļāļŦāļāđāļ§āļĒāļŦāļāļķāđāļāđāļāđāļŠāļđāļāļĢāļāļ§āļēāļĄāļŠāļąāļĄāļāļąāļāļāđāļāļąāļāļāļĩāđ</h3>
oC/5 = oF -32/9 = K - 273/5
āļāļąāļ§āļāļĒāđāļēāļ āļāļļāļāļŦāļ āļđāļĄāļīāļĢāđāļēāļāļāļēāļĒāļāļāļāļāļāđāļĢāļēāļāļāļāļīāļāļ·āļ 37 āļāļāļĻāļēāđāļāļĨāđāļāļĩāļĒāļŠ āļāļ°āļĄāļĩāļāđāļēāđāļāđāļēāđāļāđāļāļŦāļāđāļ§āļĒāļāļāļĻāļēāļāļēāđāļĢāļāđāļŪāļāđ
āļ§āļīāļāļĩāļāļģ āļāļēāļāļŠāļđāļāļĢ oC/5 = oF-32/9
37/5 = oF-32/9
7.4 x 9 = oF - 32
66.6 = oF - 32
oF = 66.6 + 32
= 98.6 oF
āļāļąāļāļāļąāđāļāļāļļāļāļŦāļ āļđāļĄāļīāļĢāđāļēāļāļāļēāļĒāļāļāļāļāļāļāļāļāļīāļāļ°āđāļāđāļēāļāļąāļ 98.6 āļāļēāđāļĢāļāđāļŪāļāđ
</pre>
</body>
</html>
āļāļĨāļĨāļąāļāļāđ
Addresses : <addresses>
<addresses>
āđāļāđāļāļāļāļāļāļāđāļāļāļ§āđāļē content āļ āļēāļĒāđāļāđ<addresses>...</addresses> āđāļāđāļ content āļāļĩāđāļĄāļĩāđāļāļ·āđāļāļŦāļēāđāļāļĩāđāļĒāļ§āļāļąāļāļāđāļāļĄāļđāļĨāļāļĩāđāļāļĒāļđāđāļŦāļĢāļ·āļāļāđāļāļĄāļđāļĨāļāļīāļāļāđāļ
Presentational elements : <b>, <i>, <u>, <s>, <tt>, <sup>, <sub>, <strike>, <big> āđāļĨāļ° <small>
āđāļāđāļŠāļģāļŦāļĢāļąāļāļāļģāļŦāļāļ/āļāļąāļāļāļēāļĢāļāļēāļĢāđāļŠāļāļāļāļĨāļāļāļāļāđāļāļāļ§āļēāļĄāļāđāļēāļ āđ āđāļāđāļ
<b>
āļāļģāļŦāļāļāđāļŦāđāđāļāđāļāļāļąāļ§āļŦāļāļē<i>
āļāļģāļŦāļāļāđāļŦāđāđāļāđāļāļāļąāļ§āđāļāļĩāļĒāļ<sup>
āļāļģāļŦāļāļāđāļŦāđāđāļŠāļāļāļāļĨāļāļĒāļđāđāļāđāļēāļāļāļ (āđāļŠāļāļāļāļĨāđāļāļĨāļąāļāļĐāļāļ°āđāļŦāļĄāļ·āļāļāļāļąāļ§āļāļĩāđāļāļģāļĨāļąāļ)<sub>
āļāļģāļŦāļāļāđāļŦāđāđāļŠāļāļāļāļĨāļāļĒāļđāđāļāđāļēāļāļĨāđāļēāļ (āđāļŠāļāļāļāļĨāđāļāļĨāļąāļāļĐāļāļ°āļāļāļāļāļąāļ§āļŦāđāļāļĒ)
Phrase elements : <em>, <strong>, <abbr>, <dfn>, <blockquote>, <q>, <cite>, <code>, <kbd>, <var> āđāļĨāļ° <samp>
āđāļāđāđāļāļāļēāļĢāļāļģāļŦāļāļ/āļāļąāļāļāļēāļĢāļāļēāļĢāđāļŠāļāļāļāļĨāļāļāļāļāđāļāļāļ§āļēāļĄāļāđāļēāļ āđ āđāļāđāļ
<em>
āļāļģāļŦāļāļāđāļŦāđāđāļāđāļāļāļąāļ§āđāļāļĩāļĒāļ<strong>
āļāļģāļŦāļāļāđāļŦāđāđāļāđāļāļāļąāļ§āļŦāļāļē<abbr>
āļāļģāļŦāļāļāđāļŦāđāļāļĩāļāđāļŠāđāļāļāļļāļāđāļāđāļāļĨāļēāđāļāđāļāđāļāļāļ§āļēāļĄāļāļąāđāļ āđ<q>
āđāļāđāļāļāļēāļĢāļāļģāļŦāļāļāđāļāļĢāļ·āđāļāļāļŦāļĄāļēāļĒāļāļąāļāļŦāļāļđ ( "..." ) āļāļĢāļāļāļāđāļāļāļ§āļēāļĄāļāļąāđāļ
Lists : <ul>, <ol>, <li>, <dl>, <dt> āđāļĨāļ° <dd>
āđāļāđāļŠāļĢāđāļēāļāļĢāļēāļĒāļāļēāļĢāđāļāļĢāļđāļāđāļāļāļāđāļēāļ āđ āđāļāđāđāļāđ
āļĢāļēāļĒāļāļēāļĢāđāļāļāđāļĄāđāļĄāļĩāļĨāļģāļāļąāļ : <ul>
, <li>
<ul>
, <li>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>

āļĢāļēāļĒāļāļēāļĢāđāļāļāļĄāļĩāļĨāļģāļāļąāļ : <ol>
, <li>
<ol>
, <li>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
āļĢāļēāļĒāļāļēāļĢāđāļāļāļāļģāļāļāļīāļāļēāļĒ : <dl>
, <dt>
, <dd>
<dl>
, <dt>
, <dd>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
</body>
</html>
Tables : <table>, <tr>, <td>, <th>
āđāļāđāđāļāļāļēāļĢāļŠāļĢāđāļēāļāļāļēāļĢāļēāļ āđāļāļĒ
<table>
āļ āļēāļĒāđāļāđ tag āļāļĩāđ āļāļ°āđāļāđāļāļŠāđāļ§āļāļāļāļāļāļēāļĢāļēāļāļāļąāđāļāļŦāļĄāļ<tr>
āļ āļēāļĒāđāļāđ tag āļāļĩāđ āļāļ°āđāļāđāļāđāļāļ·āđāļāļŦāļēāļāļĩāđāļāļĒāļđāđāđāļāđāļāļ§āđāļāļĩāļĒāļ§āļāļąāļāļāļąāđāļāļŦāļĄāļ<td>
āļ āļēāļĒāđāļāđ tag āļāļĩāđ āļāļ°āđāļāđāļāđāļāļ·āđāļāļŦāļēāļāļĩāđāļāļĒāļđāđāđāļāļāļāļĨāļąāļĄāļāđ<th>
āļ āļēāļĒāđāļāđ tag āļāļĩāđ āļāļ°āđāļāđāļāđāļāļ·āđāļāļŦāļēāļāļĩāđāļāļĒāļđāđāđāļāļāļāļĨāļąāļĄāļāđ āđāļāđāđāļāļ·āđāļāļŦāļēāļāļ°āđāļŠāļāļāļāļĨāđāļāļĢāļđāļāļāļāļāļāļąāļ§āļŦāļāļēāđāļāđāļāđāļŦāļĄāļ·āļāļāļŦāļąāļ§āļāđāļ
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
<style>
table,th,td {
border: 1px solid brown;
}
</style>
</head>
<body>
<table>
<tr>
<th>menu</th>
<th>pice</th>
</tr>
<tr>
<td>Coffee</td>
<td>45</td>
</tr>
<tr>
<td>Tea</td>
<td>50</td>
</tr>
<tr>
<td>Milk</td>
<td>40</td>
</tr>
</table>
</body>
</html>
āļāļĨāļĨāļąāļāļāđ
Editing elements : <ins> āđāļĨāļ° <del>
āđāļāđāļŠāļģāļŦāļĢāļąāļāļāļąāļāļāļēāļĢāļāļąāļāļāđāļāļāļ§āļēāļĄ
<ins>
āđāļāđāļŠāļģāļŦāļĢāļąāļāļāļĩāļāđāļŠāđāļāđāļāđāļāđāļāļāļ§āļēāļĄ<del>
āđāļāđāļāļĩāļāļāđāļēāļāđāļāļāļ§āļēāļĄ
Grouping elements : <div> āđāļĨāļ° <span>
āđāļāđāđāļāļāļēāļĢāļāļąāļāļāļĨāļļāđāļĄāļāđāļāļĄāļđāļĨāđāļĨāļ°āļāļĢāļ°āļāļģāļāļąāļāļāļĨāļļāđāļĄāļāļąāđāļ āđ āļāļēāļĄāļāļĩāđ attribute āļŦāļĢāļ·āļ āļāļēāļĄāļāļĩāđ CSS āđāļāđāļāļģāļŦāļāļāđāļ§āđ
<div>
āđāļāđāļāļāļēāļĢāļāļąāļāļāļēāļĢāđāļāļĢāļ°āļāļąāļ block-level<span>
āđāļāđāļāļāļēāļĢāļāļąāļāļāļēāļĢāđāļāļĢāļ°āļāļąāļ inline-level
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<div style="color: blue;">
<h3>London</h3>
<p>London is the capital city of England. It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants.</p>
<p>Standing on the River Thames, London has been a major settlement for two millennia, its history
going back to its founding by the Romans, who named it Londinium.</p>
</div>
<p>My mother has <span style="background-color:yellow;font-weight:bold">yellow</span> eyes
and my father has <span style="background-color:pink;font-weight:bold">pink</span> eyes.</p>
</body>
</html>
āļāļĨāļĨāļąāļāļāđ
Anchor element : <a>
āļĄāļąāļāļāļģāļĄāļēāđāļāđāļāļđāđāļāļąāļ href attribute āđāļāļ·āđāļāđāļāđāđāļāļāļēāļĢāđāļāļ·āđāļāļĄāđāļĒāļāđāļ§āđāļāđāļāļāđāļāļĒāļąāļāļāļĩāđ/āļŠāļīāđāļāļāđāļēāļ āđ āđāļāļĒāļāļēāļĢāđāļāļ·āđāļāļĄāđāļĒāļāļāļĩāđāļāļ°āđāļĢāļĩāļĒāļāļ§āđāļē hyperlink āļāļķāđāļāļāļēāļĢāļĨāļīāļāļāđāđāļāđāļāđāļāđāļāļŠāļāļāļāļĢāļ°āđāļ āļ āļāļ·āļ
Internal link
āđāļāđāļāļāļēāļĢāļĨāļīāļāļāđāđāļāļĒāļąāļāļŦāļāđāļēāļāļ·āđāļ āđ āđāļāļŦāļāđāļēāđāļ§āđāļāđāļāļāđāđāļāļĩāļĒāļ§āļāļąāļ āļĄāļąāļāđāļāđāļāđāļ§āđāđāļ server āļŦāļĢāļ·āļāđāļŦāļĨāđāļāđāļāđāļāļāđāļāļĄāļđāļĨāđāļāļĩāļĒāļ§āļāļąāļ āļĄāļąāļāđāļāđāļāļāļēāļĢāļĨāļīāļāļāđāđāļāļĒāđāļāđ path name
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<a href="/HelloWorldCamp/page2.html"> domain name and path name </a>
</body>
</html>
External link
āđāļāđāļāļāļēāļĢāļĨāļīāļāļāđāđāļāļĒāļąāļāđāļ§āđāļāđāļāļāđāļŦāļĢāļ·āļāđāļ§āđāļāđāļāļāļāļ·āđāļ āđ āļāļĩāđāđāļĢāļēāđāļĄāđāđāļāđāļāļģāļāļĒāļđāđ āļĄāļąāļāđāļāđāļāļāļēāļĢāļĨāļīāļāļāđāđāļāļĒāđāļāđ URL āļāļĩāđāđāļāđāļ domain name āđāļĨāļ° path name
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<a href="https://www.w3schools.com/"> only domain name </a>
<a href="https://www.w3schools.com/html/html_basic.asp"> domain name and path name </a>
</body>
</html>
HTML Multimedia
āđāļāļŠāđāļ§āļāļāļĩāđāđāļāđāļāđāļāļ·āđāļāļŦāļēāļāļĩāđāļĄāļĩāļāļ§āļēāļĄāđāļāļĩāđāļĒāļ§āļāđāļāļāļāļąāļāļāļēāļĢāļāļģāđāļāļē Multimedia āļāđāļēāļ āđ āđāļāđāđāļāđ video, audio, plug-ins, youtube āļĄāļēāđāļāđāđāļāđāļ§āđāļāđāļāļāļāļāļāđāļĢāļē āđāļāļĒāļāļĩāđāļāļ°āļĒāļāļāļąāļ§āļāļĒāđāļēāļāļāļēāļĢāļāļģāļ§āļīāļāļĩāđāļāļāļēāļ youtube āļĄāļēāđāļāđāđāļŠāļāļāļāļāđāļ§āđāļāđāļāļ āļāļķāđāļāđāļĢāļēāļāļģāđāļāđāļāļāļĩāđāļāļ°āļāđāļāļāđāļāđ
iframe element : <iframe>
<iframe>
src
attribute āđāļāđāđāļāļāļēāļĢāļāļģāļŦāļāļ URL āļāļāļ āļ§āļīāļāļĩāđāļāļāļĩāđāđāļĢāļēāļāļģāļĄāļēāļāļēāļ youtubewidth
āđāļĨāļ°height
attributes āđāļāđāđāļāļāļēāļĢāļāļģāļŦāļāļāļāļāļēāļāļāļ§āļēāļĄāļāļ§āđāļēāļāđāļĨāļ°āļāļ§āļēāļĄāļŠāļđāļāļāļāļāļ§āļīāļāļĩāđāļāļāļĩāđāļāļ°āđāļŠāļāļāļāļĨāļāļāđāļ§āđāļāđāļāļ
āļāļąāļ§āļāļĒāđāļēāļ
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Page Title</title>
</head>
<body>
<iframe width="420" height="315"
src="https://www.youtube.com/embed/tgbNymZ7vqY">
</iframe>
</body>
</html>
āļāļĨāļĨāļąāļāļāđ
Last updated
Was this helpful?