[go: up one dir, main page]
Scribd
Upload
7 views31 pages

Text Formating Tag

This document provides an overview of HTML text formatting tags, including the structure of an HTML document, the use of headings, paragraphs, links, images, and various attributes. It also covers additional formatting elements such as bold, italic, subscript, superscript, and comments. The document serves as a guide for creating and formatting web pages using HTML.

Uploaded by

abc.c9.b11
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
7 views31 pages

Text Formating Tag

This document provides an overview of HTML text formatting tags, including the structure of an HTML document, the use of headings, paragraphs, links, images, and various attributes. It also covers additional formatting elements such as bold, italic, subscript, superscript, and comments. The document serves as a guide for creating and formatting web pages using HTML.

Uploaded by

abc.c9.b11
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 31

HTML TEXT FORMATTING TAGS

HTML
HTMLDocument

All HTML documents must start with a document type


declaration: <!DOCTYPE html>.

The HTML document itself begins with <html> and ends


with </html>.

The visible part of the HTML document is


between <body> and </body>
HTML
 The <!DOCTYPE> Declaration
 The <!DOCTYPE> declaration represents the
document type, and helps browsers to display
web pages correctly.
 It must only appear once, at the top of the page
(before any HTML tags).
 The <!DOCTYPE> declaration is not case
sensitive.
 The <!DOCTYPE> declaration for HTML5 is:
HTML HEADINGS

HTML headings are defined with


the <h1> to <h6> tags.

<h1> defines the most important heading.

<h6> defines the least important heading:


<h1>This is heading 1</h1>

<h2>This is heading 2</h2>

<h3>This is heading 3</h3>


HTML Paragraphs

HTML paragraphs are defined with the <p> tag:

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML <P> ELEMENT

 The HTML <p> element defines a paragraph.

 <p>This is a paragraph.</p>
<p>This is another paragraph.</p>
HTML LINKS

HTML links are defined with the <a> tag:

<a href="index.html">Home</a>
HTML IMAGES

HTML images are defined with the <img> tag.


The source file (src), alternative text (alt), width,
and height are provided as attributes:

<img src="w3schools.jpg" alt="W3Schools.com"


width="104" height="142">
<body>
<h1 style="background-color:powderblue;">This is a
heading</h1>
<p style="background-color:tomato;">This is a
paragraph.</p>

</body>
HTML ATTRIBUTES
 HTML attributes provide additional information about
HTML elements

 HTML Attributes
 All HTML elements can have attributes
 Attributes provide additional information about elements
 Attributes are always specified in the start tag
 Attributes usually come in name/value pairs
like: name="value"

THE HREF ATTRIBUTE

 The <a> tag defines a hyperlink.


The href attribute specifies the URL of the page
the link goes to:
 <a href=" <a href="index.html">Home</a>
THE SRC ATTRIBUTE

The src Attribute


The <img> tag is used to embed an image in an
HTML page. The src attribute specifies the path
to the image to be displayed:
THE WIDTH AND HEIGHT ATTRIBUTES

 The width and height Attributes


 The <img> tag should also contain
the width and height attributes, which specifies
the width and height of the image (in pixels):
 Example

 <img src="img_girl.jpg" width="500" height="6


00">
HTML IMAGES SYNTAX

 The HTML <img> tag is used to embed an


image in a web page.
 The <img> tag is empty, it contains attributes
only, and does not have a closing tag.
 The <img> tag has two required attributes:

 src - Specifies the path to the image

 alt - Specifies an alternate text for the image


THE STYLE ATTRIBUTE

 The style attribute is used to add styles to an


element, such as color, font, size, and more.
 Example

 <p style="font-size:160%;">This is a
paragraph.</p>
 HTML Horizontal Rules
 The <hr> tag defines a thematic break in an
HTML page, and is most often displayed as a
horizontal rule.
 The <hr> element is used to separate content
(or define a change) in an HTML page:
HTML LINE BREAKS

 The HTML <br> element defines a line break.


 Use <br> if you want a line break (a new line)
without starting a new paragraph:
 <p>This is<br>a paragraph<br>with line
breaks.</p>
 The <br> tag is an empty tag, which means that
it has no end tag.
THE HTML <PRE> ELEMENT

 The HTML <pre> element defines preformatted


text.
 The text inside a <pre> element is displayed in
a fixed-width font (usually Courier), and it
preserves both spaces and line breaks:
 <pre>
My Bonnie lies over the ocean.
My Bonnie lies over the sea.
My Bonnie lies over the ocean.
Oh, bring back my Bonnie to me.
</pre>
HTML <B> AND <STRONG> ELEMENTS

 The HTML <b> element defines bold text,


without any extra importance.
 <b>This text is bold</b>
THE HTML <STRONG> ELEMENT

 The HTML <strong> element defines text with


strong importance.
 The content inside is typically displayed in bold.

 <strong>This text is important!</strong>


HTML <I> ELEMENT

 The HTML <i> element defines a part of text in


an alternate voice or mood. The content inside
is typically displayed in italic.
 <i>This text is italic</i>
HTML <DEL> ELEMENT HTML <INS> ELEMENT

 The HTML <del> element defines text that has


been deleted from a document. Browsers will
usually strike a line through deleted text:

 The HTML <ins> element defines a text that


has been inserted into a document. Browsers
will usually underline inserted text:
HTML <SUB> ELEMENT

The HTML <sub> element defines subscript


text. Subscript text appears half a character
below the normal line, and is sometimes
rendered in a smaller font.
 Subscript text can be used for chemical
formulas, like H2O:
HTML <SUP> ELEMENT

 HTML <sup> Element


 The HTML <sup> element defines superscript
text. Superscript text appears half a character
above the normal line, and is sometimes
rendered in a smaller font. Superscript text can
be used for footnotes, like WWW[1]:
 <p>It Is <sup>superscripted</sup> text.</p>
HTML COMMENTS

 HTML comments are not displayed in the


browser, but they can help document your
HTML source code.
 HTML Comment Tags
 You can add comments to your HTML source by
using the following syntax:
 <!-- Write your comments here -->
HTML EDITORS

Note Pad
HTML <MARK> ELEMENT

 The HTML <mark> element defines text that


should be marked or highlighted:
 <p>Do not forget to
buy <mark>milk</mark> today.</p>
HTML <SMALL> ELEMENT, <STRONG> ELEMENT

 The HTML <small> element defines smaller


text:
 The HTML <strong> element defines text with
strong importance. The content inside is
typically displayed in bold.

You might also like