Introduction to the Hyper Text markup language (HTML) - pdf

This pdf file contains some of the following titles:







pdf Introduction to the Hyper Text markup language (HTML)



HTML HEADINGS

The HTML tag tag defines the titles on the web page based on their importance. This is a heading . HTML Headings Tags Example.

HTML uses six levels of heading tags from <H1> to <H6>.

<H1> defines the most important heading, whereas the <H6> defines the least important heading in the document.



<H1> This is a most important heading in the document </H1> 

<H2> This is a slightly less important title in the document </H2>

<H3> This is a little less important title in the document </H3>

<H4> This is a next little less important title in the document </H4>

<H5> This is a very little l important title in the document </H5>

<H6> This is a least important heading in the document </H6>

Heading tags can have many of the same attributes as paragraph tags


HTML Headings Tags Example

code:


<h1>This is a heading 1</h1>
<h2>This is a heading 2</h2>
<h3>This is a heading 3</h3>
<h4>This is a heading 4</h4>
<h5>This is a heading 5</h5>
<h6>This is a heading 6</h6>

result:

This is a heading 1

This is a heading 2

This is a heading 3

This is a heading 4

This is a heading 5
This is a heading 6


LINKING TO ANOTHER PART OF THE SAME PAGE

Intradocument Hyperlink

Also known as a named document link, is linking to a location on the same page and to specific locations on another web page.
To link to a specific location on a web page, use an anchor tag with pound sign # and the id attribute.
The pound sign # indicates that you’re pointing to a spot on the same page.
The id attribute must be a unique value and can not contain spaces.


EXAMLE: go to footer




<!DOCTYPE html>
<html>
  <head>
    <title>Links to specific part on the HTML page</title>
    <meta charset="UTF-8">
  </head>
  <body>
  <div id="header">
   <h1 id="headline">Links to specific part on the HTML page</h1>
  </div>
<h2>Intradocument Hyperlink</h2>
 <p>Also known as a named  <font color="red">document link</font>,  
is linking to a location on the same page and to specific locations on another web page.<br>
To link to a specific location on a web page, use an anchor tag with  pound sign  
<font color="red">#</font> and the  <font color="red">id</font> attribute.<br>
The pound sign <font color="red">#</font> indicates that you’re pointing to a spot on the same page.<br>
The <font color="red">id</font> attribute must be a unique value and can not contain spaces.<br>
EXAMLE: <a href="#footer">go to footer</a>
 </p>
<br>
<div id="footer">
 <h4>FOOTER</h4>
    <p><a href="#headline">Back to headline</a></p>
</div>
  </body>
</html>



FOOTER

Back to headline


NESTED LISTS

Sometimes it is necessary to add other smaller lists to the main list because there are subtemplates of one or more list items. It is then necessary to create NESTED LIST.
Nested list contains one or more other lists inside self. That list gives you a better and clearer overview of all the data.

HTML Nested List with Example

<ul>
    <li>Hardware
      <ul>
         <li>Computers</li>
         <li>Mobile Devices</li>
         <li>Gadgets</li>
      </ul>
    </li>
    <li>Software
      <ul>
         <li>Windows</li>
         <li>Linux</li>
         <li>Android</li>
      </ul>
    </li>
    <li>Programming
      <ul>
         <li>C</li>
         <li>C++</li>
         <li>PYTHON</li>
         <li>JAVA</li>
         <li>PHP</li>
      </ul>
    </li>
</ul>


    result:
  • Hardware
    • Computers
    • Mobile Devices
    • Gadgets
  • Software
    • Windows
    • Linux
    • Android
  • Programming
    • C
    • C++
    • PYTHON
    • JAVA
    • PHP



LINKING AN IMAGE TO A WEB PAGE

Unlike text links, image links are more appealing to users.
To create image links, an image tag <img> should be inserted between the anchor element <a> </a>

example:
<a href="https://websitebackgrounds.itpresent.com"><img src="backgrounds.jpg"></a>

result:
Backgrounds for Websites
click to image



HTML SOUNDS FILES

The HTML <audio> element is used to embed sound content to a HTML page.


<audio controls>
  <source src="waltz.mp3" type="audio/mpeg">
</audio>

result:





pdf Introduction to the Hyper Text markup language (HTML)