Unit-1 HTML5 and CSS Web Designing-1
What is HTML?
HTML stands for Hyper Text Markup Language.
HTML is the standard markup language for creating Web pages.
HTML describes the structure of a Web page.
HTML consists of a series of elements.
HTML elements tell the browser how to display the content.
HTML is Not Case Sensitive.
The first version of HTML was written by Tim Berners-Lee in 1993. Since then,
there have been many different versions of HTML.
Structure OF HTML Page
<!DOCTYPE html> The <html> element is the root element
<html> of an HTML page.
<head> The <head> element contains meta
<title>Page Title</title> information about the HTML page.
</head> The <title> element specifies a title for
<body> the HTML page.
<h1>My First Heading</h1> The <body> element defines the
<p>My first paragraph.</p> document's body, and is a container for
</body> all the visible contents, such as headings,
</html> paragraphs, images, hyperlinks, tables,
lists, etc.
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 html> declaration defines that this document is an HTML5
document.
Text Formatting Tags
<b> - Bold text
<strong> - Important text
Page No. 1
,Unit-1 HTML5 and CSS Web Designing-1
<i> - Italic text
<em> - Emphasized text
<mark> - Marked text
<small> - Smaller text
<del> - Deleted text
<ins> - Inserted text
<sub> - Subscript text
<sup> - Superscript text
<br> -break Line
Example: Output On Brower:
<body>
<b>this is bold Text</b><br> this is bold Text
This is Strong Text
<strong>This is Strong Text</strong><br>
This is Italic Text
<i>This is Italic Text</i><br>
This is Emphasize Text(Bold+Italic)
<em>This is Emphasize Text</em><br>
This is Marked Text
<mark>This is Marked Text</mark><br> This is Deleted Text
<del>This is Deleted Text</del><br> This is Inserted Text
<ins>This is Inserted Text</ins><br>
<p>This is Subscript Text i.e This is Subscript Text i.e H2O
<sub>2</sub>O</p><br>
<p>This is Superscript Text i.e This is Superscript Text i.e (a+b)2
(a+b)<sup>2</sup></p>
</body>
Block Formatting Tags
<p> Tag:
The <p> tag defines a paragraph.
Browsers automatically add a single blank line before and after each <p>
element.
<hr> Tags
The <hr> tag defines a thematic break in an HTML page.
The <hr> element is most often displayed as a horizontal rule that is used to
separate content (or define a change) in an HTML page.
Page No. 2
, Unit-1 HTML5 and CSS Web Designing-1
Example:
<p>HTML is the standard markup language for creating Web pages. </p>
<hr>
<p>CSS saves a lot of work, because it can control the layout of multiple
web pages all at once. </p>
HTML <h1> to <h6> Tags:
The <h1> to <h6> tags are used to define HTML headings.
<h1> defines the most important heading. <h6> defines the least important.
heading.
Example: Output:
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
<pre> Tags
The <pre> tag defines preformatted text.
Text in a <pre> element is displayed in a fixed-width font, and the text
preserves both spaces and line breaks. The text will be displayed exactly as
written in the HTML source code.
Example: Output:
<h1>The pre element</h1>
Text in a pre
Element is
The pre element
Displayed. Text in a pre Element is Displayed.
<pre> Text in a pre Text in a pre
element element
is displayed is displayed
</pre>
Page No. 3
What is HTML?
HTML stands for Hyper Text Markup Language.
HTML is the standard markup language for creating Web pages.
HTML describes the structure of a Web page.
HTML consists of a series of elements.
HTML elements tell the browser how to display the content.
HTML is Not Case Sensitive.
The first version of HTML was written by Tim Berners-Lee in 1993. Since then,
there have been many different versions of HTML.
Structure OF HTML Page
<!DOCTYPE html> The <html> element is the root element
<html> of an HTML page.
<head> The <head> element contains meta
<title>Page Title</title> information about the HTML page.
</head> The <title> element specifies a title for
<body> the HTML page.
<h1>My First Heading</h1> The <body> element defines the
<p>My first paragraph.</p> document's body, and is a container for
</body> all the visible contents, such as headings,
</html> paragraphs, images, hyperlinks, tables,
lists, etc.
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 html> declaration defines that this document is an HTML5
document.
Text Formatting Tags
<b> - Bold text
<strong> - Important text
Page No. 1
,Unit-1 HTML5 and CSS Web Designing-1
<i> - Italic text
<em> - Emphasized text
<mark> - Marked text
<small> - Smaller text
<del> - Deleted text
<ins> - Inserted text
<sub> - Subscript text
<sup> - Superscript text
<br> -break Line
Example: Output On Brower:
<body>
<b>this is bold Text</b><br> this is bold Text
This is Strong Text
<strong>This is Strong Text</strong><br>
This is Italic Text
<i>This is Italic Text</i><br>
This is Emphasize Text(Bold+Italic)
<em>This is Emphasize Text</em><br>
This is Marked Text
<mark>This is Marked Text</mark><br> This is Deleted Text
<del>This is Deleted Text</del><br> This is Inserted Text
<ins>This is Inserted Text</ins><br>
<p>This is Subscript Text i.e This is Subscript Text i.e H2O
<sub>2</sub>O</p><br>
<p>This is Superscript Text i.e This is Superscript Text i.e (a+b)2
(a+b)<sup>2</sup></p>
</body>
Block Formatting Tags
<p> Tag:
The <p> tag defines a paragraph.
Browsers automatically add a single blank line before and after each <p>
element.
<hr> Tags
The <hr> tag defines a thematic break in an HTML page.
The <hr> element is most often displayed as a horizontal rule that is used to
separate content (or define a change) in an HTML page.
Page No. 2
, Unit-1 HTML5 and CSS Web Designing-1
Example:
<p>HTML is the standard markup language for creating Web pages. </p>
<hr>
<p>CSS saves a lot of work, because it can control the layout of multiple
web pages all at once. </p>
HTML <h1> to <h6> Tags:
The <h1> to <h6> tags are used to define HTML headings.
<h1> defines the most important heading. <h6> defines the least important.
heading.
Example: Output:
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
<pre> Tags
The <pre> tag defines preformatted text.
Text in a <pre> element is displayed in a fixed-width font, and the text
preserves both spaces and line breaks. The text will be displayed exactly as
written in the HTML source code.
Example: Output:
<h1>The pre element</h1>
Text in a pre
Element is
The pre element
Displayed. Text in a pre Element is Displayed.
<pre> Text in a pre Text in a pre
element element
is displayed is displayed
</pre>
Page No. 3
