Hypertext Markup Language
HTML
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<a href="https://www.w3schools.com">This is a link</a>
</body>
</html>
<img src="w3schools.jpg" alt="W3Schools.com" width="104"
height="142">
<html>
<body>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
</body>
</html>
<html>
<body>
<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>
<p>
This paragraph
contains a lot of spaces
in the source code,
but the browser
ignores it.
</p>
<p>
The number of lines in a paragraph depends on the
size of the browser window. If you resize the
browser window, the number of lines in this
paragraph will change.
</p>
</body>
</html>
<html>
<body>
<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
</body>
</html>
<html>
<body>
<p><b>This text is bold</b></p>
<p><i>This text is italic</i></p>
<p>This is<sub> subscript</sub> and <sup>superscript</sup></p>
</body>
</html>
<table>
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
</table>
<html>
<body>
<table border=2 cellpadding=6 cellspacing=6 bgcolor=pink
bordercolor="aqua”>
<caption>Details</caption>
<tr>
<th bgcolor=green>Person 1</th>
<tr>
<td>16</td>
<td>14</td>
<td>10</td>
</tr>
</table>
<th>Person 2</th>
<th bgcolor=green>Person 3</th>
</tr>
<tr bgcolor=red>
<td>Emil</td>
<td>Tobias</td>
<td>Linus</td>
</tr>
</body>
</html>
<table>
<table>
<tr>
<th colspan="2">Name</th> <tr>
<th>Age</th>
<th>Name</th>
</tr>
<td>Jill</td>
<tr>
<td>Jill</td>
</tr>
<td>Smith</td>
<tr>
<td>43</td>
</tr>
<th rowspan="2">Phone</th>
<tr>
<td>555-1234</td>
<td>Eve</td>
<td>Jackson</td>
</tr>
<td>57</td>
<tr>
</tr>
</table>
<td>555-8745</td>
</tr>
</table>
<html>
<body>
<h2>An unordered HTML list</h2>
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
</body>
</html>
<html>
<body>
<h2>An ordered HTML list</h2>
<ol>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ol>
</body>
</html>
<html>
<body>
<h2>A Description List</h2>
<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>
</body>
</html>
<html>
<body>
<h2>A Nested List</h2>
<p>Lists can be nested
(list inside list):</p>
<ul>
<li>Coffee</li>
<li>Tea
<ul>
<li>Black tea</li>
<li>Green tea</li>
</ul>
</li>
<li>Milk</li>
</ul>
</body>
</html>
<html>
<body>
<ol type="i" start="4">
<li> Four </li>
<li> Five </li>
<li> Six </li>
</ol>
<ol type="I" start="1">
<li> Alex </li>
<li> Deeksha </li>
<li> Ray </li>
<li> Neha </li>
</ol>
<ol type="A" start="1">
<li> Alex </li>
<li> Deeksha </li>
<li> Ray </li>
<li> Neha </li>
</ol>
<ol type="a" start="1">
<li> Alex </li>
<li> Deeksha </li>
<li> Ray </li>
<li> Neha </li>
</ol>
<ol type="1" start="1">
<li> Alex </li>
<li> Deeksha </li>
<li> Ray </li>
<li> Neha </li>
</ol></body></html>
<html>
<body>
<ul type="square">
<li> A </li>
<li> B </li>
<li> C </li>
</ul>
<ul type="disc">
<li> Alex </li>
<li> Deeksha </li>
<li> Ray </li>
</ul>
<ul type="circle">
<li> Alex </li>
<li> Deeksha </li>
<li> Ray </li>
</ul>
</body>
</html>
<html>
<body>
<marquee bgcolor=green width="60%" direction="up" height="100px“ scrolldelay=1>
This is a sample scrolling text that has scrolls in the upper direction.
</marquee>
<marquee
behavior="scroll"
direction="up"
scrollamount="1">Slow
Scrolling</marquee>
<marquee behavior=“slide" direction="right" scrollamount="12">Little Fast
Scrolling</marquee>
<marquee
behavior=“alternate"
direction="left"
scrollamount="20">Fast
Scrolling</marquee>
<marquee behavior="scroll" direction="right" scrollamount="50“>Very Fast
Scrolling</marquee>
</body>
</html>
1. <html>
<body>
<a href=“a1.html">Welcome to w3schools</a>
</body>
</html>
2. <html>
<body bgcolor="red" text="yellow" link="blue" alink="#FFFF00"
vlink="#FF00FF">
<a href="a.html">Welcome to w3schools</a>
</body>
</html>
<html>
<body>
<a href=“a.html">
<img alt=“image here" src=“one.jpg" width="170" height="57">
</a>
</body>
</html>
<html>
<body>
<img src="one.jpg" height="40px" width="80px" border="6">
<br>
<img src= "D:\BCA\one1.jpg" title="Forest" height="25%" width="30%"
alt="Wallpaper">
</body>
</html>
<html>
<body>
This is a <em>beautiful</em> language. <br>
Mark these <mark>words</mark>.<br>
These examples are <strong>very important</strong>.<br>
Do you know the nickname of <abbr title = "Rowan Atkinson">Mr. Bean</abbr>?<br>
You are studying <acronym>HTML</acronym>.<br>
<div>
<h2>This is a title inside the div element</h2>
<ol>
<li>Identifiers</li>
<li>Keywords</li>
</ol>
</div>
<hr>
<p>The above example displays some sample content inside a div element.</p>
</body>
</body>
</html>
<html>
<body>
<video width="320" height="240" controls autoplay muted loop>
<source src=“moa.mp4" type="video/mp4">
<source src=“moa.ogg" type="video/ogg">
</video>
</body>
</html>
<audio controls>
<source src="horse.ogg" type="audio/ogg">
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>
<html>
<body>
<form action="a.html" method="get">
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
<html>
<body>
<form action="a.html" method="get">
<button type="button" onclick="alert('Hello world!')">Click
Me!</button>
</form>
</body>
</html>
<html>
<body>
<h1>The span element</h1>
<p>My mother has <span style="color:blue;font-weight:bold">blue</span>
eyes and my father has <span style="color:darkolivegreen;fontweight:bold">dark green</span> eyes.</p>
</body>
</html>
<html>
<body>
<h1>Form with checkboxes</h1>
<form action=“a.html" method="get">
<input type="checkbox" name="vehicle1" value="Bike">
<label for="vehicle1"> I have a bike</label><br>
<input type="checkbox" name="vehicle2" value="Car">
<label for="vehicle2"> I have a car</label><br>
<input type="checkbox" name="vehicle3" value="Boat" checked>
<label for="vehicle3"> I have a boat</label><br><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
•<input
•<input
•<input
•<input
•<input
local">
•<input
•<input
•<input
•<input
•<input
•<input
type="button">
type="checkbox">
type="color">
type="date">
type="datetimetype="email">
type="file">
type="hidden">
type="image">
type="month">
type="number">
<input type="password">
<input type="radio">
<input type="range">
<input type="reset">
<input type="search">
<input type="submit">
<input type="tel">
<input type="text"> (default value)
<input type="time">
<input type="url">
<input type="week">
<html>
<body>
<h1>The select element</h1>
<p>The select element is used to create a drop-down list.</p>
<form action="a.html">
<label for="cars">Choose a car:</label>
<select name="cars" id="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="opel">Opel</option>
<option value="audi">Audi</option>
</select>
<br><br>
<input type="submit" value="Submit">
</form>
<p>Click the "Submit" button and the form-data will be sent to a page on the
server called "a.html".</p>
</body>
</html>
<html><body>
<h1>The fieldset element</h1>
<form action=“a.html">
<fieldset>
<legend>Personalia:</legend>
<label for="fname">First name:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">Last name:</label>
<input type="text" id="lname" name="lname"><br><br>
<label for="email">Email:</label>
<input type="email" id="email" name="email"><br><br>
<label for="birthday">Birthday:</label>
<input type="date" id="birthday" name="birthday"><br><br>
<input type="submit" value="Submit">
</fieldset>
</form>
</body></html>
<html>
<head>
<title>Frame tag</title>
</head>
<frameset rows="30%, 40%, 30%">
<frame name="top" src="frame1.html" >
<frame name="main" src="frame2.html">
<frame name="bottom" src="frame3.html">
</frameset>
</html>
<html>
<head>
<title>Frame tag</title>
</head>
<frameset cols="25%,50%,25%">
<frame src="frame1.html" >
<frame src="frame2.html">
<frame src="frame3.html">
</frameset>
</html>
<html>
<body>
<h1>The iframe element</h1>
<iframe src="a.html" title="W3Schools Free Online Web Tutorials">
</iframe>
</body>
</html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>Hello World!</h1>
<h2>I am formatted with a linked style
sheet.</h2>
<p>Me too!</p>
</body>
</html>
Styles.css
p{
color: red;
text-align: center;
}
