Scribd
Upload
48 views

HTML - Authoring Tools: Unit 1

The document provides an introduction to HTML and describes several HTML elements and tags for formatting text, adding images, links, lists, tables, and other content in a webpage. It includes examples of key HTML tags for headings, paragraphs, images, links, ordered and unordered lists, tables, comments, and input controls as well as tags for styling text with fonts, colors, sizes, and other attributes.

Uploaded by

Bhuvanesh Raam
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
48 views

HTML - Authoring Tools: Unit 1

The document provides an introduction to HTML and describes several HTML elements and tags for formatting text, adding images, links, lists, tables, and other content in a webpage. It includes examples of key HTML tags for headings, paragraphs, images, links, ordered and unordered lists, tables, comments, and input controls as well as tags for styling text with fonts, colors, sizes, and other attributes.

Uploaded by

Bhuvanesh Raam
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 29

HTML – Authoring Tools

Unit 1
Introduction

● HTML means Hyper Text Markup language which is a standard markup


language for web pages. HTML will have elements, attributes, and other
tags.
● Most of the websites present on internet use HTML. HTML is easy to learn
and powerful.
● Hypertext is the major method by which we are moving around the web by
clicking on Hyperlinks which redirects to another page.
● Markup shows text inside them using HTML tags by marking a test as a
certain type.
● HTML Command elements are building blocks of an HTML page and can
have attributes which provide additional information about the element and
attributes will be present in pairs.
HTML Commands
<html>

<title>Page Title</title>

<body>

<h1>This is a Heading</h1>

<p>This is a paragraph.</p>

<p>This is another paragraph.</p>

</body>

</html>
HTML Headings

<h1> This is heading1 </h1>

<h2> This is heading2 </h2>

<h3> This is heading3 </h3>

<h4> This is heading4 </h4>


HTML images element

<html>
<title>Page Title</title>
<body>
<h1>This is a Heading</h1>
<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
<img src="E:\shobana\Subjects\ITE\tree.webp" alt="Tree" style="width:1120px;height:950px">
</body>
</html>
BACKGROUND IMAGE
<body background="E:\shobana\Subjects\ITE\Sea.jpg">
ADDING AUDIO to YOUR WEBPAGE
<embed src="E:\image\video1.mp4" height = "350" width="500" autostart="True"></embed>

<embed src="E:\image\song.mp3" height="100" width="100" autostart="false"></embed>

<bgsound src="E:\image\ck.mp3" loop="infinite">


Lists in HTML

● There are three types of lists in HTML:-


● Unordered Lists
● Ordered Lists
● Definition Lists

● Unordered Lists
<ul>
<li> Coffee</li>
<li> Tea </li>
<li> Milk </li>
</ul>
● Ordered List
<ol>
<li value="15">List number 1</li>
<li value="10">List number 2</li>
<li value="20">List number 3</li>
</ol>
● Definition list - contains list of items with a description or definition of each
item
<dl>
<dt>Item number 1</dt>
<dd>Definition or Description for 1st Item</dd>
<dt>Item number 2</dt>
<dd>Definition or Description for 2nd Item</dd>
<dt>Item number 3</dt>
<dd>Definition or Description for 3rd Item</dd>
</dl>
Create a table in HTML

<table>
<tr>
<th>Firstname</th>
<th> Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
</table>
GIVE NAME to ANY SECTION of YOUR WEB PAGE

<a name="section name">My section</a>


Link in the HTML

<a href="https://www.amazon.com">This link take you to shopping.Happy


Shopping </a>

Link with in the Same Page


<a href="#section name" rel="nofollow" target="_blank" >Link to My section of
this web page</a>
ADDING COMMENTS

<!--Text within these tags are not displayed by the Web Browser-->
Style attribute

<p style="color:red"> I am a paragraph </p>


Format the HTML elements

<b> This text is bold </b>


Highlight some text in the HTML

<h2> html <mark> Marked </mark> formatting </h2>


Delete some text in HTML

<p> My favorite color is <del> Navy blue </del> Red </p>


Superscripted text

<p> This is <sup> superscripted </sup> text </p>


Abbreviation

<p> The <abbr title=”World Health Organization” >WHO </abbr> was founded
in 1948 </p>
Address in the HTML

<address>

Written by Kalam <br>

MIT.com <br>

Pincode : 600084, Chennai <br>

India

</address>
Display a webpage inside a webpage

<iframe src="E:\shobana\Subjects\ITE\test.html" height="300" width="300" >


</iframe><br/>
Setting Font Size

<font size = "6">Font size = "6"</font><br />


Setting Font face

<font face = "Comic sans MS" size =" 5">Comic Sans MS</font><br />
Setting Font Color

<font color = "#FF00FF">This text is in pink</font><br />

<font color = "red">This text is red</font>


Input Text Control-Single line Input Text Control
Input Text Control-Multi-line Input Text Control
Password Input Control
Input Type Radio
Input Type Checkbox

You might also like