HTML
__________________________________________________________________________________________________
Html: Hyper Text Markup Language
- Is a standard markup language for creating web pages and it describes the structure of the webpage.
Features of html:
- It is easy to learn and use
- It is an independent platform
- Images, Videos, Audio and text can be added to the web page
advantages:
- iT is used to build websites
- It is supported by all browsers
Disadvantages:
- It uses large amount of codes to make simple web pages
- Its security is not good
WWW
- World wide web
- Written in tags
Tags:
- They are strings enclosed of angular brackets (<.....>)
- Is predefines and is not case sensitive
Opening of HTML
_<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
Common HTML tags:
- Headings
<h1> to <h6>........</h1></h2>
- Body
<body> ......... </body>
- Font
<font>.....</font>
- Paragraph
<p>........</p>
- Links
< a href=”url”></a>
- Images
<img src=”image.jpg”>
Attributes of <body> tag
- Background
<body background=”background.jpg”>
- Bg Color
<body bgcolor=”........”>
- Link
<body link=”............”>
- vlink
<body vlink=”....”>
- Alink
<body alink=”.....”>
Attributes of <font> tag
- Color
<font color=”.....”>
- size
<font colour=”.....”>
List
- Defines the unordered list: <ul>:
-- Defines a list item: <li>:
___ <ul>
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
- Defines the ordered list: <ol>
-- Defines a list item: <li>
___<ol>
<li>First item</li>
<li>Second item</li>
<li>Third item</li>
</ol>
- Defines the definition list: <dl>
-- Defines a list item: <li>
- Defines a term (definition term): <dt>:
-- Defines a list item: <li>
- Defines a description (definition description): <dd>
-- Defines a list item: <li>
Forms
<form>
- Input Text
...........: <input type="text" name=”...”>
- iNput Password
............: <input type="password" name=”...”>
- radio
...............<input type="radio">
- Checkbox
..............<input type="checkbox">
- Select
.............<select name=”...”>
<option>..........</option>
- Input Submit
............<input type="submit" value="Submit">
- Input Reset
............<input type="reset" value="Reset">
Table
<table>
- Defines a table row: <tr>
- Defines a table header cell (usually bold and centered): <th>
- Defines a table data cell:<td>
___<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
<tr>
<td>Data 3</td>
<td>Data 4</td>
</tr>
</table>
Attributes of <table> tag
- Align: Horozontal align
<table align=“center”>
<table align=”left”>
<table align=”right”>
- Valign: vertical align
<table valign=”middle”>
<table valign=”top”>
<table valign=”bottom”>
link
<a>
- href
<a href=”url”>.......</a>
__<a href=”url”>......</a>
Image
<img>
- src: Specifies the path to the image file.
<img src=”path/to/image.jpg”>
- alt: Provides alternative text for the image
<img alt=”description of image”>
- Width
<img width=”...”>
-height
<img height=”...”>
Audio
<audio>
- src: Specifies the path to the audio file
<audio src="path/to/audio.mp3">
- Loop: Specifies that the audio should start over again when finished.
<audio loop>
Example of Image and Audio
<html>
<head>
<title>Media Example</title>
</head>
<body>
<h1>Media Example</h1>
<h2>Image</h2>
<img src="path/to/image.jpg" alt="A beautiful landscape" width="600" height="400" title="Beautiful Landscape">
<h2>Audio</h2>
<audio controls>
<source src="path/to/audio.mp3" type="audio/mp3">
<source src="path/to/audio.ogg" type="audio/ogg">
</audio>
</body>
</html>
Line
<hr>
- Height
<hr height=”...”>
- Width
<hr width=”...”>
- color
<hr color=”...”>
Space
<Br>
