- Superscript text
HTML Comment Tags
-----------------
You can add comments to your HTML source by using the following syntax
.. code-block:: html
:linenos:
HTML Comment </div>
</head>
<body>
<!-- add heading here -->
<h1> Learning how to use comment in html </h1>
<!--
explain about comment
1. single line comment
2. multi lines comment
-->
<p>
Single line comment is used when comment stays in single line.
</p>
<p>
Multi lines comment is used when comment take more than one line.
</p>
</body>
</html>
HTML Links
----------
HTML links are hyperlinks.
You can click on a link and jump to another document.
.. code-block:: html
:linenos:
<!DOCTYPE html>
<html>
<head>
<title> HTML Links
HTML Links
This link connect to external link
Visit linkedin profile to
learn more
about the author.
.. code-block:: html
:linenos:
HTML Links
HTML Links
This link connect to internal link (link within your website)
Visit homepage
visit home page
about the author.
.. code-block:: html
:linenos:
HTML Links
HTML Links
This link connect to elements within same page
go to about session
This is about session.
HTML Images
-----------
In HTML, images are defined with the ![]()
tag.
The ![]()
tag is empty, it contains attributes only, and does not have a closing tag.
The src attribute specifies the URL (web address) of the image.
.. code-block:: html
:linenos:
HTML Images
Lorem Ipsum
This code serves image from the web
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nunc eu augue laoreet urna mollis tincidunt et a nisi.
Cras ante purus, egestas sit amet pellentesque eget,
ullamcorper nec turpis. Donec in nibh risus.
of what the image contains:
.. code-block:: html
:linenos:
HTML Images
Lorem Ipsum
This code serves image from website folder
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nunc eu augue laoreet urna mollis tincidunt et a nisi.
Cras ante purus, egestas sit amet pellentesque eget,
ullamcorper nec turpis. Donec in nibh risus.
of what the image contains:
HTML Table
----------
An HTML table is defined with the tag.
Each table row is defined with the tag. A table header is defined with the | tag.
By default, table headings are bold and centered. A table data/cell is defined with the | tag.
.. code-block:: html
:linenos:
HTML Table
Lorem Ipsum
| Firstname |
Lastname |
Age |
| Jill |
Smith |
50 |
| Eve |
Jackson |
94 |
| John |
Doe |
80 |
Unordered HTML List
-------------------
An unordered list starts with the tag. Each list item starts with the - tag.
The list items will be marked with bullets (small black circles) by default.
.. code-block:: html
:linenos:
HTML List
An unordered HTML list
Unordered link doesn't include number for items
Ordered HTML List
-------------------
An ordered list starts with the tag. Each list item starts with the - tag.
The list items will be marked with numbers by default.
.. code-block:: html
:linenos:
HTML List
An unordered HTML list
Ordered link does include number for items
- Coffee
- Tea
- Milk
HTML Block and Inline Elements
------------------------------
Every HTML element has a default display value depending on what type of element it is.
The default display value for most elements is block or inline.
Block-level Elements
^^^^^^^^^^^^^^^^^^^^
A block-level element always starts on a new line and takes up the full width available
(stretches out to the left and right as far as it can).
.. code-block:: html
:linenos:
HTML Block Elements
Hello
World
The DIV element is a block element, and will start on a new line.
Block level elements in HTML:
|