Scribd
Upload
5 views7 pages

Vii HTML

The document provides an introduction to HTML, explaining its purpose as a markup language for creating and designing webpages. It covers the basic structure of an HTML document, common HTML tags, attributes, and formatting options. Additionally, it includes examples of HTML code for various elements such as headings, paragraphs, images, lists, tables, and text formatting.

Uploaded by

bhavyajain5142
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
5 views7 pages

Vii HTML

The document provides an introduction to HTML, explaining its purpose as a markup language for creating and designing webpages. It covers the basic structure of an HTML document, common HTML tags, attributes, and formatting options. Additionally, it includes examples of HTML code for various elements such as headings, paragraphs, images, lists, tables, and text formatting.

Uploaded by

bhavyajain5142
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/ 7

CLASS – VII

HTML
What is HTML?
• HTML stands for HyperText Markup Language.
• It is used to create and design webpages on the internet.
• HTML tells the browser how to display the content on the webpage.
HTML Tags: HTML code is written inside tags. Tags are like instructions for the browser.
o Every tag has an opening tag <tag> and a closing tag </tag>.
o The opening tag tells where the code begins.
o The closing tag tells where the code ends.
Basic Structure of an HTML Document:

<html>
<head>
<title>Title of the Page</title>
</head>
<body>

</body>
</html>

o <html>: The root tag for an HTML document.


o <head>: Contains meta-information about the document like the title.
o <body>: Contains the content of the webpage that people see.

Common HTML Tags


1. <h1> to <h6> (Heading Tags):
o These tags are used for headings. <h1> is the largest, and <h6> is the smallest.
o Example: <h1>This is a Heading 1</h1>
<h2>This is a Heading 2</h2>
2. <p> (Paragraph Tag):
o Used to write paragraphs of text.
o Example: <p>This is a paragraph of text.</p>
3. <img> (Image Tag):
o Used to add images to a webpage.
o Example: <img src="image.jpg" alt="Description of image">
o src: Specifies the image file.
o alt: Provides a description of the image (used when the image is not found or for
accessibility).

<HTML>
<HEAD> <TITLE> VI E DEMO </TITLE>
</HEAD>

<BODY BGCOLOR="AQUA">
<H1> CYBER BULLYING </H1>
<H2> CYBER BULLYING </H2>
<H3> CYBER BULLYING </H3>
<H4> CYBER BULLYING </H4>
<H5> CYBER BULLYING </H5>
<H6> CYBER BULLYING </H6>
<hr>
<img src="file:///C:/Users/HP/Downloads/OIP%20(3).jpeg" width="400px" height="400px">
<P> Cyberbullying is a form of cybercrime where individuals use online platforms, such as social media and
gaming communities, to harm others. This can involve sharing negative posts, false information, or personal
details about a victim to humiliate or threaten them. It is a serious issue that can have devastating effects on
a victim's life, including severe emotional distress and, in some cases, suicide. Unlike traditional bullying,
cyberbullying leaves behind digital traces, which can help identify the perpetrators and provide evidence for
justice. </P>
</BODY>
</HTML>

4. <ul> and <ol> (List Tags):


o <ul> is used for unordered lists (bulleted lists). Type attribute value 1,a,A,I,i
o <ol> is used for ordered lists (numbered lists). Type attribute value disc, square, circle,
none
o The Default value for ul is 1 and for ol the default value is disc.
o Example:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<ol>
<li>First item</li>
<li>Second item</li>
</ol>
5. <dl> (description list):
A description list is used to create a list of terms and their descriptions. It is often used for
glossaries, definitions, or any content that has a key-value pair.
In HTML, a description list is created using the following three tags:
o <dl> – This tag is used to define the description list.
o <dt> – This tag is used to define a description term (the word or phrase you want to
define).
o <dd> – This tag is used to define the description or definition of the term
Syntax:

<dl>
<dt>Term 1</dt>
<dd>Description or definition for term 1.</dd>

<dt>Term 2</dt>
<dd>Description or definition for term 2.</dd>

<dt>Term 3</dt>
<dd>Description or definition for term 3.</dd>
</dl>

Code:

<html>
<head> <title> list in html </title>
</head>
<body>
<h1> programming language </h1>

<ol type="a">
<li> java </li>
<li> python </li>
<li> c++ </li>
<li> c# </li>
</ol>
<ul type="none">
<li> java </li>
<li> python </li>
<li> c++ </li>
<li> c# </li>
</ul>

<dl>
<dt> Malware </dt>
<dd> It is a malicious program </dd>
<dt> Computer network </DT>
<dd> It is a inter-connected network of computer </dd>
</dl>

</body>
</html>

6. <table> (Table Tag):


o Used to create tables.
Syntax:

<table border="1">
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
</table>

o <tr> defines a row.


o <th> defines a table header.
o <td> defines a table cell.
Code:

<HTML>
<HEAD> <TITLE> CONCEPT OF TABLES </TITLE>
<STYLE>
TABLE,TD,TH
{
BORDER: 4PX SOLID RED;
BORDER-COLLAPSE:COLLAPSE;
}
</STYLE>
</HEAD>

<BODY BGCOLOR="AQUA">
<TABLE>
<TR>
<TH> ROLL NO. </TH>
<TH> NAME </TH>
<TH> ADDRESS </TH>
<TH> PHONE NO. </TH>
</TR>

<TR>
<TD> 1 </TD>
<TD> ARJUN </TD>
<TD> MAYUR VIHAR PHASE II </TD>
<TD>989997678 </TD>
</TR>

<TR>
<TD> 2 </TD>
<TD> ANAMIKA</TD>
<TD> NOIDA </TD>
<TD>9777997678 </TD>
</TR>

<TR>
<TD> 3 </TD>
<TD>KARAN</TD>
<TD> VAISHALI GZB</TD>
<TD>9777997222</TD>
</TR>

</TABLE>
</BODY>
</HTML>

HTML Attributes
Attributes provide additional information about HTML elements. They are written inside the opening tag.
• src: Used in <img> tags to specify the image source.
• alt: Used in <img> to describe the image.
• Width: used in <img> to describe the breadth of an image
• height: used in <img> to describe the height of an image
Example:
<img src="image.jpg" alt="An example image" width="300" height="200">
HTML Formatting Tags
1. Bold Text: <b> makes text bold.
Example: <b>This is bold text</b>
2. Italic Text: <i> makes text italic.
Example: <i>This is italic text</i>
3. Underlined Text: <u> makes text underlined.
Example: <u>This is underlined text</u>
Code:

<html>
<head>
<title>Bold, Italic, and Underline Demo</title>
</head>
<body>
<h1>Bold, Italic, and Underline Example</h1>

<p><b>This text is bold.</b></p>


<p><i>This text is italic.</i></p>
<p><u>This text is underlined.</u></p>

<p>Here is combined style:</p>


<p><b><i><u>This text is bold, italic, and underlined.</u></i></b></p>

</body>
</html>

4. Break Line: <br> adds a line break (moves text to the next line).
Example: This is the first line.<br>This is the second line.
Code:

<html>
<head>
<title>Using <br> Tag</title>
</head>
<body>
<h1>Line Break Example</h1>

<p>This is the first line.<br>This is the second line after a line break.</p>

<p>Here is another example:<br>Line 1<br>Line 2<br>Line 3</p>


</body>
</html>

You might also like