HTML & Html Element
Published: 2022-12-24 15:10:35

<ul>
<li><p>to learn how to make websites then first step to know about HTML. </p>
</li>
<li><p>html is the Structurer of all websites</p>
</li>
</ul>
<h2 id="heading-html"><strong>HTML</strong></h2>
<ul>
<li>HTML stands for Hypertext markup language.</li>
<li>This is the standard markup language for creating web pages. It describes the structure of a web page .</li>
</ul>
<p><strong><em>Structure of HTML :-</em></strong></p>
<pre><code>&lt;!DOCTYPE html&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta http-equiv="X-UA-Compatible" content="IE=edge"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;
    &lt;link rel="stylesheet" href="style/style.css"&gt;
    &lt;title&gt;This is a Title&lt;/title&gt;
&lt;/head&gt;
&lt;body&gt;
     &lt;h1&gt;This is a heading&lt;/h1&gt;
     &lt;p&gt;This is a paragraph&lt;/p&gt;
&lt;/body&gt;
&lt;/html&gt;
</code></pre><h2 id="heading-html-elements"><strong>HTML Elements</strong></h2>
<ul>
<li>HTML Elements tells the browser how to display content.</li>
<li>HTML elements are created with tags. It is defined by a start tag and an end tag and between these tags there is content.</li>
<li>Some HTML elements represent visible components on a web page, such as text, images, or buttons, while others denote different sections of the page or provide meta information about the document.</li>
<li>Some HTML elements that don't have an end tag are called <strong>empty elements</strong>. Now Let's see some tags :</li>
</ul>
<p><strong>Basic HTML Tags:</strong></p>
<pre><code>&lt;html&gt;: This is the root element <span class="hljs-keyword">of</span> an HTML element.
&lt;head&gt;: This is a container <span class="hljs-keyword">for</span> metadata. It is placed between the &lt;html&gt; tag
        and the &lt;body&gt; tag.
&lt;link&gt;: It defines the relationship between a <span class="hljs-built_in">document</span> and external resources.
&lt;title&gt;: It defines the title <span class="hljs-keyword">of</span> a <span class="hljs-built_in">document</span>.
&lt;body&gt;: It defines the <span class="hljs-built_in">document</span><span class="hljs-string">'s body. and is a container for all the visible
        contents, such as headings, paragraphs, images, audio, videos, hyperlinks,
        tables, lists, etc.</span>
</code></pre><h3 id="heading-heading-tags"><strong>Heading Tags :</strong></h3>
<ul>
<li>HTML heading tag is used to define the heading of the HTML document.</li>
</ul>
<pre><code>The &lt;h1&gt; tag defines the most important tag, and &lt;h6&gt; defines the least
important heading.
Example :
<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">h1</span>&gt;</span>This  is heading 1 <span class="hljs-tag">&lt;/<span class="hljs-name">h1</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">h2</span>&gt;</span>This  is heading 2<span class="hljs-tag">&lt;/<span class="hljs-name">h2</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">h3</span>&gt;</span>This  is heading 3<span class="hljs-tag">&lt;/<span class="hljs-name">h3</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">h4</span>&gt;</span>This  is heading 4<span class="hljs-tag">&lt;/<span class="hljs-name">h4</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">h5</span>&gt;</span>This  is heading 5<span class="hljs-tag">&lt;/<span class="hljs-name">h5</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">h6</span>&gt;</span>This  is heading 6<span class="hljs-tag">&lt;/<span class="hljs-name">h6</span>&gt;</span></span>
</code></pre><h3 id="heading-paragraph-tag"><strong>Paragraph Tag :</strong></h3>
<p>A paragraph always starts on a new line and is usually a <strong>block</strong> of text.</p>
<pre><code>HTML paragraph defined <span class="hljs-keyword">with</span> the &lt;p&gt; tag.
Example :
<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">p</span>&gt;</span> This is a paragraph <span class="hljs-tag">&lt;/<span class="hljs-name">p</span>&gt;</span></span><span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">p</span>&gt;</span> This is another paragraph <span class="hljs-tag">&lt;/<span class="hljs-name">p</span>&gt;</span></span>
</code></pre><h3 id="heading-html-links"><strong>HTML Links :</strong></h3>
<p>The HTML anchor tag defines a hyperlink that links one page to another page.</p>
<pre><code>HTML links are defined <span class="hljs-keyword">with</span> the &lt;a&gt; tag.
Example :
<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"https://www.ineuron.ai"</span>&gt;</span><span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span></span>
href - It means Hypertext Reference. which indicates the link<span class="hljs-string">'s destination.</span>
</code></pre><h3 id="heading-image-tag"><strong>Image Tag :</strong></h3>
<pre><code>The &lt;img&gt; tag is used to embed an image <span class="hljs-keyword">in</span> an HTML page. This is a self-closing
tag, which means <span class="hljs-built_in">this</span> tag has no end tag.
&lt;img src=<span class="hljs-string">""</span> &gt;
src - This is an attribute. It specifies the path to the image to be displayed
on a web page.
</code></pre><p>### </p>
<h3 id="heading-html-formatting-elements"><strong>HTML Formatting Elements :</strong></h3>
<pre><code>&lt;b&gt; : Bold Text
&lt;strong&gt; : Important Text
&lt;i&gt; : Italic Text
&lt;em&gt; : Emphasized Text
&lt;mark&gt; : Marked Text (Highlighted text)
&lt;small&gt; : Smaller text
&lt;sub&gt; : Subscript text
&lt;sup&gt; : Superscript text
&lt;q&gt; : Quotation mark
&lt;blockquote&gt; : Defines a section that is quoted <span class="hljs-keyword">from</span> another source.
&lt;cite&gt; : Defines the title <span class="hljs-keyword">of</span> a work.
&lt;address&gt; : Defines contact information <span class="hljs-keyword">for</span> the author <span class="hljs-keyword">of</span> a <span class="hljs-built_in">document</span>.
&lt;ins&gt; : Inserted text (Underline text)
&lt;del&gt; : Deleted text
</code></pre><h3 id="heading-empty-elements"><strong>Empty Elements :</strong></h3>
</br><p style="color:#757CF9;">This article is published w/ <a target="_blank" href="https://scattr.io?ref=dev">Scattr  ↗️</a></p>