Scribd
Upload
89 views25 pages

HTML Tutorial: by P.Kiran Kumar

The document provides an introduction to HTML, describing what HTML is, common HTML markup tags, how to structure HTML documents, and examples of key HTML elements and tags. It covers core elements, text formatting, lists, tables, forms, and attributes for various tags. The document serves as an educational guide for learning basic HTML.

Uploaded by

Purnima Chateker
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
89 views25 pages

HTML Tutorial: by P.Kiran Kumar

The document provides an introduction to HTML, describing what HTML is, common HTML markup tags, how to structure HTML documents, and examples of key HTML elements and tags. It covers core elements, text formatting, lists, tables, forms, and attributes for various tags. The document serves as an educational guide for learning basic HTML.

Uploaded by

Purnima Chateker
Copyright
© Attribution Non-Commercial (BY-NC)
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 25

HTML Tutorial

By
P.Kiran Kumar
What is HTML?
HTML is a language for describing web pages.
 Stands for Hyper Text Markup Language
 Not a programming language
 It is markup language which is a set of markup
tags
 HTML uses markup tags to describe web
pages
HTML Markup Tags
 It is usually called HTML tags
 HTML tags are keywords surrounded by angle
brackets such as <html>
 HTML tags normally come in pairs like <b> and </b>
 The first tag in a pair is the start tag, the second tag is
the end tag
 Start and end tags are also called opening tags and
closing tags
HTML Documents
 HTML documents describe web pages.
 HTML documents contain HTML tags and plain text.
 HTML documents are also called web pages.
 The purpose of a web browsers (like Internet
Explorer) is to read HTML documents and display
them as web pages.
 The browser does not display the HTML tags, but
uses the tags to interpret the content of the page.
Editing HTML
 A plain text editor (like Notepad) to edit HTML.
 Professional web developers often prefer HTML
editors like FrontPage or Dreamweaver, instead of
writing plain text.
 When you save an HTML file, you can use either
the .htm or the .html extension. (prefer .html)
 Not Case sensitive
 <!-- Comments goes here -->
HTML Example
<html>
<head><title>Sasi Institute Of Technology and Engineering</title><head>

<body>

<h1>My First Heading</h1>

<p>My first paragraph.</p>

</body>
</html>
Core Elements
 Core elements are
 <html>
 <head>
 <title>
 <body>
Basic Text Formatting
 <h1> <h2><h3><h4><h5><h6>
 <p>
 <br>
 <pre>
Presentational Elements
 Bold text - <b>
 Italic text - <i>
 Underline text - <u>
 Tele Type text - <tt>
 Super Script - <sup>
 Sub script - <sub>
 Bigger text - <big>
 Smaller Text - <small>
 Horizontal line - <hr>
 Strike - <strike>
List Elements
 UnOrder List
 <ul> <li>
 Order List
 <ol> <li>
 Definition List
 <dl> Definition list
 <dt> Definition term

 <dd>Definition Description
UnOrder List
Code Output
<UL TYPE=DISC>
<LI>coffee
<LI>tea
<LI>lemonade
• coffee
</UL> • tea
• lemonade
<UL TYPE=CIRCLE>
<LI>coffee
<LI>tea
<LI>lemonade
o coffee
</UL> o tea
o lemonade
<UL TYPE=SQUARE>
<LI>coffee
<LI>tea
<LI>lemonade
coffee
</UL> tea
lemonade
Order List
Code Output
<OL TYPE=1>
<LI> html tutorial
<LI>Web Technologies</OL> 1. html tutorial
2. Web Technologies
<OL TYPE=A>
<LI>html tutorial
<LI>Web Technologies</OL> A. html tutorial
B. Web Technologies
<OL TYPE=a>
<LI>html tutorial
<LI>Web Technologies</OL> a. html tutorial
b. Web Technologies
<OL TYPE=I>
<LI>html tutorial
<LI>Web Technologies I. html tutorial
</OL> II. Web Technologies
<OL TYPE=i>
<LI>html tutorial
<LI>Web Technologies</OL> i. html tutorial
ii. Web Technologies
<OL START=5> 5. Place geletin mold over plate
<LI>Place geletin mold over plate
<LI>Tap gently with a spoon 6. Tap gently with a spoon
<LI>Lift mold off of geletin 7. Lift mold off of geletin
</OL>
Definition List
code output
<DL>
<DT>flame
<DD>an ugly argument in a newsgroup
<DT>spam
flame
<DD>annoying unrequested email
<DT>troll
an ugly argument in a newsgroup
<DD>someone who start flames by posting stupid things spam
</DL>
annoying unrequested email
troll
someone who start flames by
posting stupid things
TABLE
 Markup tags used
 <table>
 <tr>
 <th>
 <td>
Attributes for table markup tag
 Align
 Bgcolor
 Border
 Cellpadding
 Cellspacing
 Summary
 Width
 dir
 Rules
 None
 All
 Rows
 Cols
Attributes for tr markup tag
 Bgcolor
 Valign
 Top
 Middle
 Bottom
 baseline
 Align
 Left
 Right
 Center
 Justify
Attributes for td / th markup tags
 Abbr
 Align
 Bgcolor
 Colspan
 Height
 Nowrap
 Rowspan
 Valign
Forms
 <form>
 <input>
 <textarea>
 <button>
 <label>
 <select>
 <legend>
 <fieldset>
Form Attributes
 Action
 Method
 Name
Input Atrributes
 Type
 Text
 Password
 Checkbox
 Radio
 Submit
 Reset

 Name
 Value
 Size
 Maxlength
 Checked
Textarea attributes
 Name
 Rows
 cols
Button
 type
 Submit
 Reset
 button
label
 for
Selected Attributes
 Name
 Option
 Disable
 Value

You might also like