all tutorials about web design and programming in pdf format
This tutorial will guide you through the following steps:
HTML text formatting tags make certain text on your web pages to appear differently than normal text content.
These are types and examples of formatted text:
<b> This is bold style </b>
<i> This is italics style </i>
<em> This is emphasized style </em>
<strong> This is an important text </strong>
<small> This is small text </small>
<mark> This is marked text </mark>
<del> This is deleted text </del>
<sub> sub </sub>
<sup> superscript </sup>
<u> This is the underlined text </u>
<ins> This is inserted text </ins>
HTML Text Formatting Examples
code:
<p>H<sub>2</sub>SO<sub>4</sub></p><br/>
<p>2Y+2X<sup>3</sup>=150</p>
result:
H2SO4
2Y+2X3=150
To insert images on HTML pages, the <img> tag is required with the SRC attribute.
<img src="earth.png">
Using the width and height attributes, you can specify the size of the image in pixels or percentages.
<img src="earth.png" width="150px" height ="125px" >
The HTML anchor element <a> </a> creates a hyperlink to specifics part on the same HTML page, other web pages, scripts or any other URL adress.
The anchor element is used together with the href attribute that contains the URL of the files.
Syntax: <a href="url">text link</a>
example:
There are relative and absolute HTML links.
Relative links show the path to files relative to the current document on the same web site or computer. It is recommended for use always where it can be used.
example:
Absolute links/paths contain a complete URL, which includes a HTTPS protocol, the website’s domain name and possibly a specific folders, subfolders and page name.
example:
There are three list types in HTML:
<ul>unordered list</ul>
<ol>ordered list</ol>
<dl>definition list</dl>
Each item begins with a <li> tag.
code:
<ul>
<li>Gold</li>
<li>Silver</li>
<li>Bronze</li>
</ul>
result:
code:
<ol>
<li>Gold</li>
<li>Silver</li>
<li>Bronze</li>
</ol>
result:
code:
<dl>
<dt>FRUIT</dt>
<dd>apple</dd>
<dd>pear</dd>
<dt>VEGETABLES</dt>
<dd>cucumber</dd>
<dd>tomatoes</dd>
</dl>
result: