Scribd
Upload
19 views

HTML Class 1

HTML (Hypertext Markup Language) is the primary language used for creating web pages, utilizing tags to structure content for web browsers. The document provides examples of basic HTML structure, including the use of headings, paragraphs, lists, and tables, along with CSS styling. It serves as a tutorial for aspiring web designers and developers to understand HTML and its applications.

Uploaded by

kiruthiba
Copyright
© © All Rights Reserved
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
19 views

HTML Class 1

HTML (Hypertext Markup Language) is the primary language used for creating web pages, utilizing tags to structure content for web browsers. The document provides examples of basic HTML structure, including the use of headings, paragraphs, lists, and tables, along with CSS styling. It serves as a tutorial for aspiring web designers and developers to understand HTML and its applications.

Uploaded by

kiruthiba
Copyright
© © All Rights Reserved
Available Formats
Download as DOC, PDF, TXT or read online on Scribd
You are on page 1/ 5

Introduction to HTML:

HTML stands for Hypertext Markup Language, and it is the most widely used
language to write Web Pages. Hypertext refers to the way in which Web pages
(HTML documents) are linked together. Thus, the link available on a webpage is
called Hypertext.

As its name suggests, HTML is a Markup Language which means you use HTML to
simply "mark-up" a text document with tags that tell a Web browser how to structure
it to display.

HTML is a markup language and makes use of various tags to format the content.
These tags are enclosed within angle braces <Tag Name>. Except few tags, most of
the tags have their corresponding closing tags.
For example, <html> has its closing tag</html> and <body> tag has its closing tag
</body> tag etc.

Basic HTML Document

In its simplest form, following is an example of an HTML document:

<!DOCTYPE html>
<html>
<head>
<title>This is document title</title>
</head>
<body>
<h1>This is a heading</h1>
<p>Document content goes here.....</p>
</body>
</html>
Example 1:

<html>
<head>
<style>
.para1{
font-family:sans-serif;
font-size:20px;
margin-left:100px;
margin-right:100px;
text-align:justify;
}
.myh1{
font-family:sans-serif;
text-align:left;
}
.ul1{
margin-left:200px;
}
h1{
text-align:center;
}
</style>
</head>
<body>
<h1>HTML Tutorial</h1>
<p class="para1">HTML was created by Berners-Lee in late 1991 but "HTML
2.0" was the first standard HTML specification which was published in 1995. HTML
4.01 was a major version of HTML and it was published in late 1999. Though HTML
4.01 version is widely used but currently we are having HTML-5 version which is an
extension to HTML 4.01, and this version was published in 2012.</p>
<br>
<h1 class="myh1">Information</h1>
<ul class="ul1">
<li>CortexA55 (2Core/CPU0: use rate 62%, CPU1: use rate 62%)</li>
<li>GPU: use rate 65%</li>
<li>System/Bus/Clock: use rate 50%</li>
<li>VCP: use rate 50%</li>
<li>MIPI-DSI: use rate 90%</li>
<li>MIPI-CSI: use rate 25%</li>
<li>USB2.0: use rate 0%</li>
<li>Gbit-Ether: use rate 30%</li>
<li>DRAM use rate 43%</li>

</ul>
<p>This tutorial is designed for the aspiring Web Designers and Developers
with a need to understand the HTML in enough detail along with its simple overview,
and practical examples. This tutorial will give you enough ingredients to start with
HTML from where you can take yourself at higher level of expertise.</p>
</body>
</html>

Example 2:

<html>
<head>
</head>
<body>
<style>
table,tr,td{
font-family:sans-serif;
text-align:center;
border:solid 1px;
border-collapse:collapse;
padding-left:10px;
padding-right:10px;
padding-top:10px;
padding-bottom:10px;
margin-left:300px;
margin-right:300px;
}
p{
margin-left:100px;
margin-right:100px;
}
body{
text-align:justify;
}
</style>
<p>HTML was created by Berners-Lee in late 1991 but "HTML 2.0" was the first
standard HTML specification which was published in 1995. HTML 4.01 was a major
version of HTML and it was published in late 1999. Though HTML 4.01 version is
widely used but currently we are having HTML-5 version which is an extension to
HTML 4.01, and this version was published in 2012.</p>
<table>
<tr>
<td>REVISION HISTORY</td>
<td>RZ/G2L Reference power consumption guide(typ.) for use
case</td>
</tr>
</table>
<br>
<table class="table2">
<tr>
<td rowspan="2">Rev.</td>
<td rowspan="2">Date</td>
<td colspan="2" style="width:80%;text-align:center;">Description</td>
</tr>
<tr>

<td class="td3">Page</td>
<td class="td3">Summary</td>
</tr>
<tr style="text-align:center";>
<td>1.00</td>
<td>Oct 07, 2021</td>
<td>-</td>
<td class="td4">First edition issued</td>
</tr>
</table>
</body>
</html>

Example 3:

<html>
<head>
<style>
table,tr,td{
border:solid 2px;
border-collapse:collapse;
text-align:center;
padding-left:10px;
padding-right:10px;
}
h1{
text-align:center;
}
img{
width:200px;
height:200px;
display: block;
margin-left:auto;
margin-right:auto;
}
.mytd{
text-align:left;
padding-left:0px;
}
</style>
</head>
<body>
<h1>HTML Tutorial</h1>
<img src="Skiez_Post_1.jpg">
<table>
<tr>
<td class="mytd">Use Case</td>
<td>Operation summary</td>
<td>Power consumption (w)</td>
</tr>
<tr>
<td>Use Case</td>
<td>Operation summary</td>
<td>Power consumption (w)</td>
</tr>
<tr>
<td rowspan="2">Use Case</td>
<td>Operation summary</td>
<td>Power consumption (w)</td>
</tr>
<tr>
<td colspan="2">Operation summary</td>

</tr>
</table>
</body>
</html>

You might also like