Html

HTML
(Hyper Text Markup Language)
Junaid VK
junaidvkomy@gmail.com
www.facebook.com/junaid.omy
twitter.com/junaid.omy
in.linkedin.com/in/junaid.omy
9745991390

Disclaimer: This presentation is prepared by trainees of
baabtra as a part of mentoring program. This is not official
document of baabtra –Mentoring Partner
Baabtra-Mentoring Partner is the mentoring division of baabte System Technologies Pvt . Ltd

Hyper Text
 Refers to the way in which Web pages
(HTML documents) are linked together.
Mark-up language
 Text document with tags that tell a Web
browser how to structure it to display
Web page
 Is a web document that is suitable for
the World Wide Web and the web browser.

html
• Hyper Text Mark-up Language
is the standard mark-up
language used to create
web pages.
• Extension is .html

Structure of html
• HTML document begins with <html> tag and
ends with </html> tag.
• Documents are included in this two
tags.
• Main two parts of HTML
Webpage
• <head> </head>
• <body> </body>

Tags
• HTML markup tags are usually called HTML tags
• HTML tags are keywords (tag names)surrounded
by angle brackets like <html>
• Tags come in pairs like <p> and </p>
• first tag in a pair is the start tag or opening
tags, the second tag is the end tag or closing tags
• Not case sensitive
• end tag is written like the start tag, with
a slash before the tag name.
<Tagname>Content</Tagname>

HTML Elements
• An HTML element starts with a start tag and
ends with an end tag. So the element content
everything between start and end tag.
• Some HTML elements have Empty content.
Empty elements are closed in the start tag.
Eg ::
<hr> for horizontal line
< br> for break a line
• Most HTML elements can have attributes.

HTML Attributes
o Attributes provide additional information
about the element.
o Attributes are always specified in the
start tag .
o All attributes are made up of two parts:
a name and a value.

HTML Page
<html>
<head>
<h1><title>Baabtra</title></h1>
</head>
<body>
<p>Mentoring Partner</p>
</body>
</html>
Output

<html>….</html>
• Tel ls the browser that this
is an HTML document .
• Represents the root of an
HTML document .
• The <html> tag is the
container for al l other
HTML elements.

<head>…..</head>
• Head section of an HTML
document
• This section will not be visible in
the body of the web browser
• The name of the webpage that
appears in the title bar is placed
in this section
Example:
<title>Baabtra</title>

<body>…..</body>
• Information displayed
in this section will be
displayed in the body
of the web browser.
• The closing body tag
will always proceed the
closing HTML tag

<h1> to <h6>
• Define HTML headings
• <h1> defines the Highest level of
heading and <h6> is the smallest
level of heading.
• That is, <h1> has largest font size
and <h6> the least
Example

<span>
• The <span> tag is used to group inline-elements
in a document.
• Inline elements don’t break the text
before and after them
• Provides a way to add style to a part of a
text.
Example

Character format
• Change the color and size of your text
• Align your text
Some examples….
<b></b> bold
<i></i> italicized
<u></u> underlined
<sup></sup> Samplesuperscript
<sub></sub> Samplesubscript
<strong></strong> strong
<del></del> Deleted text – strike through

Hyperl ink Tags
• HTML links are defined with the Anchor tag like <a>.
• which is used to link from one page to another.
• href attribute link's to destination.
• By default, links will appear as follows in all browsers:
 An unvisited link is underlined and blue
 A visited link is underlined and purple
 An active link is underlined and red
<a href="http://www.google.com">Google</a>
Example

HTML Lists
• Ordered l ist
• starts with the <ol> tag.
• Each list item starts with the <li> tag.
• An ordered list can be numerical.
Example
• Unordered l ist
• Starts with the <ul> tag.
• Each list item starts with the <li> tag.
• The list items are marked with bullets.
Example

HTML Lists (Conti….)
• Descr ipt ion l ists
• List of terms/names, with a description of each
term/name.
• The <dl> tag defines a description list.
• The <dl> tag is used in conjunction with <dt> defines
terms/names and <dd> describes each term/name.
Example

HTML Tables
• Tables are defined with the <table> tag.
• Consists of the <table> element and one or
more <tr>, <th>, and <td> elements.
• The <tr> element defines a table row, the <th>
element defines a table header, and the <td> element
defines a table cell.
Example

HTML Images
• Add images to Web pages
• The <img> tag creates a holding space for the
referenced image.
<img src=“picture.jpg" align=“bottom">
• src:Specifies the URL of an image
• align:This allows you to align the image on your page.
Example

HTML Forms
• The <form> tag is used to create an HTML form for
user input.
• The <form> element can contain one or more of the
following form elements:
• <input>
• <textarea>
• <button> Example
• <select>
• <option>
• <checkbox>
• <label>

Want to learn more about programming or Looking to become a good programmer?
Are you wasting time on searching so many contents online?
Do you want to learn things quickly?
Tired of spending huge amount of money to become a Software professional?
Do an online course
@ baabtra.com
We put industry standards to practice. Our structured, activity based courses are so designed
to make a quick, good software professional out of anybody who holds a passion for coding.

Follow us @ twitter.com/baabtra
Like us @ facebook.com/baabtra
Subscribe to us @ youtube.com/baabtra
Become a follower @ slideshare.net/BaabtraMentoringPartner
Connect to us @ in.linkedin.com/in/baabtra
Give a feedback @ massbaab.com/baabtra
Thanks in advance
www.baabtra.com | www.massbaab.com |www.baabte.com

Contact Us
Emarald Mall (Big Bazar Building)
Mavoor Road, Kozhikode,
Kerala, India.
Ph: + 91 – 495 40 25 550
NC Complex, Near Bus Stand
Mukkam, Kozhikode,
Kerala, India.
Ph: + 91 – 495 40 25 550
Cafit Square,
Hilite Business Park,
Near Pantheerankavu,
Kozhikode
Start up Village
Eranakulam,
Kerala, India.
Email: info@baabtra.com

Html

Recommandé

Recommandé

Contenu connexe

Tendances

Tendances (20)

En vedette

En vedette (7)

Similaire à Html

Similaire à Html (20)

Plus de baabtra.com - No. 1 supplier of quality freshers

Plus de baabtra.com - No. 1 supplier of quality freshers (20)

Dernier

Dernier (20)

Html