Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
39 views

HTML

The document discusses HTML tags and their usage. It explains key tags like <html>, <head>, <body>, <p>, <h1-h6> and their purpose. It also covers other important tags like <img>, <table>, <a> and how to add images, tables and hyperlinks in HTML.

Uploaded by

Vishal Bhargava
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
39 views

HTML

The document discusses HTML tags and their usage. It explains key tags like <html>, <head>, <body>, <p>, <h1-h6> and their purpose. It also covers other important tags like <img>, <table>, <a> and how to add images, tables and hyperlinks in HTML.

Uploaded by

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

HTML stands for Hyper Text Markup Language

1.An HTML file is a text file containing small markup tags


2.The markup tags tell the Web browser how to display the page
3.An HTML file must have an htm or html file extension

Basic HTML Structure


<html>
<head>
<title>My first html file</title>
</head>
<body>
Hello World!
</body>
</html>
===================================================================================
==============================
Headings are defined with the <h1> to <h6> tags.
<h1> defines the largest heading while
<h6> defines the smallest.
Note:-
h1 is large,h2 will be small you can again define h1 to get large and h2
small,repetation of heading number is allowed
h1-h6 represents size of heading font
attributes:align="center/left/right",style="",id=""

===================================================================================
==============================

Paragraphs are defined with the <p> tag. Think of a paragraph as a block of text
attributes:align="center/right/left",style="",id=""
===================================================================================
==============================

<!-- This is
a comment --> ,<!-- -->

===================================================================================
==============================

Types of HTML tags


1.Logical Tags:Defines what kind of text is to be contained inside.Example<code>
tag
2.Physical Tags:Does the formating to the inside text.Example<small>tag

1.Structural tags: These tags define the structure of the HTML document. Example
<html>, <head>, <body>, <h1>, <p>, and <ul>.

2.Formatting tags: These tags are used to format the text in the HTML document.
Example <b>, <i>, <u>, <em>, and <strong>.

3.Presentational tags: These tags are used to control the presentation of the HTML
document.Example <font>, <color>, and <background>.

4.Content tags: These tags are used to embed content in the HTML document.Example
<img>, <iframe>, and <video>.

5.Form tags: These tags are used to create forms in the HTML document.Example
<form>, <input>, and <select>.

6.Empty Tags

Logical Tags
psffce:acronym

<abbr> Defines an abbreviation


<acronym> Defines an acronym
<cite> Defines citation
<dfn> Defines a definition term
<em> Defines emphasized text
<ins> Defines inserted text
<kbd> Defines keyboard text
<q> Defines short quotation
<samp> Defines sample computer code
<strong> Defines strong text
<var> Defines a variable

Physical Tags

<b> Defines bold text


<big> Defines big text
<i> Defines italic text
<small> Defines small text
<sub> Defines subscripted text
<sup> Defines superscripted text
<tt> Defines teletype test
<u> Defines underlined text

1.Structural tags:

<html> defines the root element of an HTML document.

<head> contains information about the document, such as its title and author.

<body> contains the content of the document, such as text, images, and forms.

2.Formatting tags:
(Formatting in HTML is the process of controlling the appearance of text on a web
page.)

<b> makes text bold.


<i> makes text italic.
<u> underlines text.
<em> emphasizes text.
<strong> makes text strong.

3.Presentational tags:
<font> defines the font of the text.
<color> defines the color of the text.
<background> defines the background color of the text.

4.Content tags:
<img> embeds an image in the document.
<iframe> embeds another web page in the document.
<video> embeds a video in the document.

5.Form tags:
<form> defines a form in the document.
<input> defines an input field in the form.
<select> defines a dropdown menu in the form.

6.Empty Tags
<br> tag is used when you want to start a new line
<hr> tag is an empty tag that defines a horizontal rule in an HTML document
Attributes:allign='center/left/right'; shade='shade/noshade; size='1/2/3...';
width='0-100%'.
The <img> tag is empty

Note:To display characters like <> & etc it is not always possible as they have
reserved meanings for the browser,
so to do that we use special entities like to print "<" we type....&It; or &#60;
it has 3 parts first &(ampersand) that means begining entity.....then we write
abbribation for character,like for less than we write lt.
at last we close it by semicolon ;

Entities are case sensitive

===================================================================================
===============
1.<body> tag
attributes:-
1.background:
a)specify a background-image for an HTML page.
b)The value of this attribute is the URL of the image you want to use.
c)If the image is smaller than the browser window, the image will repeat itself
until it fills the entire browser window.

example
<body background=“clouds.gif”> </body>

If you want to use a background image, you should keep in mind:


1. Will the background image increase the loading time too much?
2. Will the background image look good with other images on the page?
3. Will the background image look good with the text colors on the page?
4. Will the background image look good when it is repeated on the page?
5. Will the background image take away the focus from the text?

2.bgcolor:
a)specifies a background-color for an HTML page.
b)The value of this attribute can be a hexadecimal number, an RGB value, or a color
name:
<body bgcolor=“black”>
<body bgcolor=“rgb(0,0,0)”>
<body bgcolor=“#000000”>

==============================================================================
Hyperlink:
HTML uses the <a> anchor tag to create a link to another document or web page

a)syntax:<a href="linkname.com">I am hyperlink and i will appear bue</a>


b)a in <a> stands for anchor tag it connects a word to a new plae or document by
creating it as hyperlink
c)href stands for hypertext reference;hypertext is a page or an html doccument with
is somewhere else withrespect to the current page.
attributes:-
1.href="liinkname.com"
2.target="value"
values:-
a)"blank":To create a link that opens in a new window, you would use the following
code
b)"self": The link will open in the same window or frame as the current page. This
is the default value
c)parent: The link will open in the parent frame.
d)top: The link will open in the topmost frame.

===================================================================================
===
Adding Image
<img> tage is used to add image to an html document
attributes:-
1.src:stands for source...it contains a link/url/path of image to be added as a
value
2.height:height="103/104/200...etc"
3.Width:height="103/104/200...etc"
4.Align="center/right/left
===================================================================================
==
Tables
Tables are defined with the <table> tag
1.A table is divided into rows with the <tr> tag(tr:table row)
2.Each row is divided into data cells with the <td> tag(td:table data)
A data cell can contain text, images, lists,
paragraphs, forms, horizontal rules, tables, etc.
syntax:-to create two rows and one columb
<table>
<tr><td>HII</td>
</tr>
<tr><td>BYE</td>
</tr>
</table>
to make appear table like table define border attribute in table tage with at lest
1 as value.
note:define rows with <tr> tag and to add as many colums or data cells keep adding
<td> tag

===================================================================================
========================

You might also like