Abbrivation

Download as docx, pdf, or txt
Download as docx, pdf, or txt
You are on page 1of 35

Client:

Server:
SMTP :Simple Mail Transfer Protocol
FTP: File Transfer Protocol
HTTP: Hypertext Transfer Protocol
HTTPS: Hypertext Transfer Protocol
Secure
EMAIL: electronic mail
FATHER OF EMAIL:
Raymond Samuel Tomlinson
Web Application

What Is A Network?

- It Is A Group Of Computers Connecting With Each Other For Sharing Of Information And Resources.

The First Computer Network Introduced In 1960’s By US- DOD.( United States Department of
Defense)
- ARPANET [Advanced Research Projects Agency Network]

What Are Types Of Networks?

- LAN

- MAN

- WAN

What Is Internet?

- It Is A Wide Area Network Connecting Computers Across The Globe.

- International Network

What Is Web?
- 1990’s “Tim Berners Lee” Introduced “Web”.

- Web Is A Portion Of Internet With Restricted Access.

Who Maintains The Standards Of Web?

- W3C(World Wide Web Consortium.)


-WHATWG (Web Hypertext Application Technology Working
Group)
Web Terminology

- Server

- Website

- Webpage

Uniform Resource Locator


What Is Hyper Text?
- Hyper Is A Greek Term, Which Means“Beyond”
- Hyper Text Means, Some Text That Provides Content Beyond What You See.
What Is Markup?
- Markup Is A General Computing Term, Which Is Derived From A Concept
Called “Markingup”.
- Markup Means Preparing For Presentation.
- Html Is A Language Used For Presentation.
- Html Is Used For Presenting On Printer, Screenn [Any Device That Is From A Mobile
To Pc].
Evolution Of Html.

- Internet Started With A Browser Called “Mosaic”.

- The Languages Used For Presentation Were GML [Generic Markup Language]. And SGML [Standard
Generic Markup Language].

- Tim Berners Lee Introduced The Concept Of Web. - Tim Berners Lee Introduced A Language For
Web Called “Html” In 1993.

- HTML Is Superset To SGML. - IETF [Internet Engineering Task Force] Took The Responsibility Of
Developing Html.

- W3C [World Wide Web Consortium] And WHATWG [Web Hypertext Application Technology
Working Group] Maintained Standard Of Html And Developed Further Versions.
HTML Version Year
HTML 1.0 The first version of HTML was 1.0, which
was the barebones version of HTML
language, and it was released in1991
HTML 2 November 24, 1995 [IETF] - Form Base “File
Upload” - Tables - Client-Side Image Maps -
Internationalization
HTML 3 January 14, 1997 [W3C] - Several Feature For
Design For A Browser Called Netscape. -
Blinking - Marquee – Mathml
HTML 4 December 18, 1997 [W3C] - Transition
Elements - Frameset And Frame - Browser
Specific Elements – Multimedia
HTML 5 October 28,0 2014 [W3C – WHATWG] May 27,
2019 HTML 5.2 Latest

HTML Is A Collection Of Elements Arranged In A Hierarchy Called Dom. [Document Object Model]

Features of HTML
1) It is a very easy and simple language. It can be easily understood and modified.

2) It is very easy to make an effective presentation with HTML because it has a lot
of formatting tags.

3) It is a markup language, so it provides a flexible way to design web pages along


with the text.

4) It facilitates programmers to add a link on the web pages (by html anchor tag), so
it enhances the interest of browsing of the user.

5) It is platform-independent because it can be displayed on any platform like


Windows, Linux, and Macintosh, etc.

6) It facilitates the programmer to add Graphics, Videos, and Sound to the web
pages which makes it more attractive and interactive.

7) HTML is a case-insensitive language, which means we can use tags either in lower-case or
upper-case.
Text-based HTML Editor :

1. Notepad ++

2. Sublime Text

3. Visual Studio Code

4. Adobe Dreamweaver CC

5.Froala

6. CoffeeCup
Browsers :
1. Firefox
2. Google Chrome
3. Microsoft Edge
4. Apple Safari
5. Opera
6. Brave
7. Vivaldi
8. DuckDuckgo
9. Chromium
10.Epic

Process of save html:

1. Open text editor


2. Type html code
3. Save the file (filename.html)
Execute html code:
1.open browser
2.ctrl + O shortcut
3.select the html file , then open

Structure of html:

1. Here, the first statement is <!DOCTYPE html>. !DOCTYPE is used to tell the bowser
the type of document it is dealing it. Since, ours is an HTML document, so, we will
have to write <!DOCTYPE html> to tell that is an HTML document.
2. The second line of the program uses the tag <html>. This tag is the root element and
wraps all other tags.
3. The <head> tag contains the header information such as title of the page, metadata,
styles, or scripts. Each of these information is specified in their corresponding tags.
And all these tags should be contained within the <head> tag.

For example, we have include <title> tag within the <head> tag.

4. <script> and <noscript>: You will use these with javaScript.


5. <style>: For specifying style information. We will take it up when we will learn CSS.
6. <meta>: used to specify the metadata. What is metadata? Well, metadata is data
about data. So, this tag will contain information about the current HTML document. This
includes keywords, author, page description and setting the viewport. We will take the
meta tag in detail in the later chapters.
7. The <body> tag contains all those tags which are used to specify the content,
formatting or layout. For example, if you wish to include an image in your webpage, you
should place using its corresponding tag in the <body> section.

Concept of Closing Tags


Did you notice the </head>, </body> and the </html> tags? These are the closing tags.
HTML tags can be closing tags, also called paired tags or singular tags. Paired tags always
close with their closing tag. For example, <html>…</html>. While singular tags do not need
a closing tag.

EX:

<html>

<head>

<title>welcome to html</title>

hello world

</head>

<body>

welcometo

js

python

the css

</body>

</html>

Building blocks of HTML

o Tags: An HTML tag surrounds the content and apply meaning to it. It is
written between < and > brackets.
o Attribute: An attribute in HTML provides extra information about the
element, and it is applied within the start tag. An HTML attribute contains two
fields: name & value.

Syntax
1. <tag name attribute_name= " attr_value"> content </ tag name>

o Elements: An HTML element is an individual component of an HTML file. In an


HTML file, everything written within tags are termed as HTML elements.

EX:
<html>
<head>
<title>The basic building blocks of HTML</title>
</head>
<body>
<h2>The building blocks</h2>
<p>This is a paragraph tag</p>
<p style="color: red">The style is attribute of paragraph tag</p>
</body>
</html>

HTML Tags
HTML tags are like keywords which defines that how web browser will format and
display the content. With the help of tags, a web browser can distinguish between an
HTML content and a simple content. HTML tags contain three main parts: opening
tag, content and closing tag. But some HTML tags are unclosed tags.

When a web browser reads an HTML document, browser reads it from top to bottom
and left to right. HTML tags are used to create HTML documents and render their
properties. Each HTML tags have different properties.

An HTML file must have some essential tags so that web browser can differentiate
between a simple text and HTML text. You can use as many tags you want as per
your code requirement.

o All HTML tags must enclosed within < > these brackets.
o Every tag in HTML perform different tasks.
o If you have used an open tag <tag>, then you must use a close tag </tag> (except
some tags)

Syntax
<tag> content </tag>

<b> :Bold Tag


<i> : Italic Tag
<em> : emphasis
<u> : Under line
<p> :paragraph Tag
<strong> : it is like a bold
EX:
<html>
<head>
<title>Tags</title>
<u><b>this is html chapter</u></b>
</head>
<body>
<p>hello world welcome to <b>html and css and js </b> class</p>
<p>hello world <i>welcome to html and css and js <i> class</p>
<p>hello<em> world welcome to <strong>html and css </strong>and js </em>
class</p>
</body>
</html>
Heading tags:
It contains <h1> to <h6> heading tags
Ex:
<html>
<head>
<title>heading tags</title>
</head>
<body>
<h1>html</h1>
<h2>css</h2>
<h3>js</h3>
<h4>bootstrap</h4>
<h5>angular js</h5>
<h6>react js</h6>
</body>
</html>
Unclosed HTML Tags
Some HTML tags are not closed, for example br and hr.

<br> Tag: br stands for break line, it breaks the line of the code.

<hr> Tag: hr stands for Horizontal Rule. This tag is used to put a line across the
webpage.

Ex:
<html>
<head>
<title>heading tags</title>
</head>
<body>
<h1>html</h1>
<hr>
<p>hello world it is part <br>time to eat <br>meat and drink .</p>
</body>
</html>

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"

Id: uniquely identify an element. Two elements with same name with in a web
page ,you can use id attribute.
Ex:
<html>
<head>
<title>heading tags</title>
</head>
<body>
<h1>html</h1>
<hr>
<p title="html">hello </p><br>
<p id="hello"> girl make life </p><br>
</body>
</html>
Title:
It gives suggested title for the element. cursor move title text it display title
message.
<html>
<head>
<title>heading tags</title>
</head>
<body>
<h1>html</h1>
<hr>
<p title=" welcome to class of html "> java script </p><br>
</body>
</html>

Class:
It is associate an element with a style sheet and specify the class elements.
Syntax:
Class=”classname”

Ex:
<html>
<head>
<title>heading tags</title>
</head>
<body>
<h1>html</h1>
<hr>
<p class="hello"> java script </p><br>
</body>
</html>
Style:
It specify cascading style sheet
Syntax:
Style=”property :value”
Ex:
<html>
<head>
<title>heading tags</title>
</head>
<body>
<p style="color:red">hello </p><br>
<p style="font-family:Matura MT Script Capitals">python </p><br>
<p style="background-color:yellow">css </p><br>
<p style="font-size:20px">tilu </p><br>
<p style="text-align:right">ashok </p><br>
</body>
</html>

HTML Formatting Elements


Formatting elements were designed to display special types of text:

 <b> - Bold text


 <strong> - Important text
 <i> - Italic text
 <em> - Emphasized text
 <mark> - Marked text
 <small> - Smaller text
 <del> - Deleted text
 <ins> - Inserted text
 <sub> - Subscript text
 <sup> - Superscript text
 <strike> -strikethorugh
 <big> - increase the size
 <u> - under line

<b> :element defines bold text, without any extra importance.


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

<i> : element defines a part of text in an alternate voice or mood. The


content inside is typically displayed in italic.

<em> : element defines emphasized text


<small> : element defines smaller text
<mark> :element defines text that should be marked or highlighted
<del> : element defines text that has been deleted from a document.
Browsers will usually strike a line through deleted text
<ins> : element defines a text that has been inserted into a document.
Browsers will usually underline inserted text

<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,

EX:

H2O

<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

EX:
A2
Ex:
<html>
<head>
<title>formating tags</title>
</head>
<body>
<p><u>girl make life the </u></p>
hello <b>world </b>to home of <i>the world</i> care <big>the race</big> of
court <br>
to home of the<strike> world care</strike> the race of court
<ins>hello my friend</ins><br>
<del>python</del><br>
<small>rent</small>
<mark>welcome ashok restarent</mark><br>
X<sup>2</sup>+ y<sup>2</sup><br>
www<sup>world wide web</sup><br>
CaCo<sub>3</sub>+H<sub>2</sub>O
</body>
</html>
Dir:
Indicate the browser about the direction in which text should flow .
It contain two values
1.ltr – left to right(default value)
2.rtl – right to left (Ex-Arabic language)
Ex:
<html>
<head>
<title>heading tags</title>
</head>
<body>
<h1>html</h1>
<p bdo dir="rtl">hello my world to </p>
</body>
</html>

HTML Language :

ISO Language Codes


You should always include the lang attribute inside the <html> tag, to declare
the language of the Web page. This is meant to assist search engines and
browsers

Lang – it indicate the main language used in document.

Xmlns:lang – lang attribute replaced by it.

“hi is code of hindi”


Ex:

<html xmlns="http://www.w3.org/1999/xhtml" lang="hi" xml:lang="hi">

<body>

hello namskar

</body>

</html>

When to Use the div Tag


The div tag is multi-purpose – you can use it to do several
things on a web page. You'll mostly use it in web layouts and
CSS art, but it's super flexible.
Ultimately, you'll almost always to use it to style whatever it
contains or manipulate such things with JavaScript.

1. Use div in Web Layouts


You'll primarily use the div tag to group similar content
together so you can style it easily. A great example of this is
using div to group different sections of a webpage together.
You can put together the header, nav, sections, and footer of
a page in an individual div tag so they can be styled together.
Ex:

<!DOCTYPE html>

<html>

<body>

<h1>Multiple DIV Elements</h1>

<div style="background-color:#FFF4A3;">

<h2>London</h2>
<p>London is the capital city of England.</p>

<p>London has over 13 million inhabitants.</p>

</div>

<div style="background-color:#FFC0C7;">

<h2>Oslo</h2>

<p>Oslo is the capital city of Norway.</p>

<p>Oslo has over 600.000 inhabitants.</p>

</div>

<div style="background-color:#D9EEE1;">

<h2>Rome</h2>

<p>Rome is the capital city of Italy.</p>

<p>Rome has almost 3 million inhabitants.</p>

</div>

<p>CSS styles are added to make it easier to separate the divs, and to
make them more pretty:)</p>

</body>

</html>

2.Span:

<span> tag is used as a generic container of inline elements


The <span> tag does not have any default meaning or rendering.

o To change the language of a part of the text.


o To change the color, font, background of a part of text using CSS
o To apply the scripts to the particular part of the text.

Ex:

<!DOCTYPE html>

<html>

<head>

<title>Span Tag</title>

</head>

<body>

<h2>Example of span tag</h2>

<p>I have choosen only

<span style="color: red;">red</span>,

<span style="color: blue;">blue</span>, and

<span style="color: green;">green</span> colors for my painting.

</p>

</body>

</html>
Differences between <div> and <span> tag:
<div> <span>

The <div> tag is a block level


The <span> tag is an inline element.
element.

It is best to attach it to a section of a It is best to attach a CSS to a small


web page. section of a line in a web page.

It accepts align attribute. It does not accept align attribute.

This tag should be used to wrap any


This tag should be used to wrap a
specific word that you want to
section, for highlighting that section.
highlight in your webpage.

<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:

EX:
<html>
<head>
<title>pre</title>
</head>
<body>
<pre>
hello world
css
python
js
python
</pre>
</body>
</html>
<dfn>:
tag stands for the "definition element", and it specifies a term that is going
to be defined within the content.

Ex:
<!DOCTYPE html>
<html>
<head>
<title>Dfn tag</title>
</head>
<body>
<h2>Example of dfn Tag</h2>
<p><dfn>HTML</dfn> A markup language for Web designing</p>
</body>
</html>

<blockquote>:
It display information idenation(PARAGARAPH)
<q> :double quotes
Ex:
<!DOCTYPE html>
<html>
<body>

<h1>The blockquote element</h1>


<p>Rules of identifers:</p>

<blockquote >
Rules for defining Identifiers :
1) A java identifier is a sequence of characters, where each character may be a
letter from a-z or A-Z or a digit form 0-9 or currency symbol $ or connecting
punctuation – , if we are using any other symbol we will get Compile time error
“Illegal Character”.
</blockquote>
<q>hello my html friend</q>

</body>
</html>

<code> :
It display text monospaced font (default font size) like a programming books.
EX:
<!DOCTYPE html>
<html>
<body>

<h1>The blockquote element</h1>

<p>Rules of identifers:</p>
<p><code >
1) A java identifier is a sequence of characters, where each character may be a
letter from a-z or A-Z or a digit form 0-9 or currency symbol $ or connecting
punctuation – , if we are using any other symbol we will get Compile time error
“Illegal Character”.
</code>
</p>

</body>
</html>
<address>:
It contain address.
Ex:
<html>
<head>
<title>address tag</title>
</head>
<body>
<address>
sekhar<br>
sai nagar<br>
housing board<br>
atp
</address>
</body>
</html>
<abbr> :it display the abbreviation
Ex:
<html>
<body>

<h1>The abbr element</h1>

<p>The <abbr title="World Health Organization">WHO</abbr> was founded in


1948.</p>

</body>
</html>

HTML Anchor
The HTML anchor tag defines a hyperlink that links one page to another page. It can
create hyperlink to other web page as well as files, location, or any URL. The "href"
attribute is the most important attribute of the HTML a tag. and which links to
destination page or URL.

href attribute of HTML anchor tag


The href attribute is used to define the address of the file to be linked. In other
words, it points out the destination page. href means hyper link

The syntax of HTML anchor tag is given below.

<a href = "..........."> Link Text </a>

Target attributes:
1. _self: default, open the document in same window
2. _blank :open the document in new window .
3._parent : open the document in parent frame.
4._top : open the document in the full body of the window.
EX:
<html>
<head>
<title></title>
</head>
<body>
<p>Click on <a href="https://www.wikipedia.org" target="_top"> Link</a>to
go on home page <p> <br>
<a href="https://www.facebook.com" target="_blank">FB</a>
</body>
</html>

Create a Bookmark using <a> tag:


Using id attribute to create bookmark
Ex:
<!DOCTYPE html>
<html>
<body>

<p><a href="#C4">Jump to Chapter 4</a></p>


<p><a href="#C10">Jump to Chapter 10</a></p>

<h2>Chapter 1</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 2</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 3</h2>
<p>This chapter explains ba bla bla</p>
<h2 id="C4">Chapter 4</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 5</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 6</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 7</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 8</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 9</h2>
<p>This chapter explains ba bla bla</p>

<h2 id="C10">Chapter 10</h2>


<p>This chapter explains ba bla bla</p>

<h2>Chapter 11</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 12</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 13</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 14</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 15</h2>
<p>This chapter explains ba bla bla</p>
<h2>Chapter 16</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 17</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 18</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 19</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 20</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 21</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 22</h2>
<p>This chapter explains ba bla bla</p>

<h2>Chapter 23</h2>
<p>This chapter explains ba bla bla</p>

</body>
</html>

Image:
HTML img tag is used to display image on the web page. HTML img tag is an empty tag
that contains attributes only, closing tags are not used in HTML image element.
Syntax:
<img src="path" height="value" width="value" alt="msg" />
Attributes of HTML img tag
The src and alt are important attributes of HTML img tag.

1) src
It is a necessary attribute that describes the source or path of the image. It instructs
the browser where to look for the image on the server.

The location of image may be on the same directory or another server.

2) alt
The alt attribute defines an alternate text for the image, if it can't be displayed. The
value of the alt attribute describe the image in words. The alt attribute is considered
good for SEO prospective.

3) width
It is an optional attribute which is used to specify the width to display the image. It is
not recommended now. You should apply CSS in place of width attribute.

4) height
It h3 the height of the image. The HTML height attribute also supports iframe, image
and object elements. It is not recommended now. You should apply CSS in place of
height attribute.

Path:
1.absoulte path :
It contain image path another webpage.
Ex:
Src=https://www.google.com/img.jpg

2.Relative path :
URL does not begins with slash it will be relative URL.
Links to an image that hosted with in the web site.
Ex:
Src=”imag.jpg”

Ex:
<html>
<head>
<title> images</title>
</head>
<body>
<h2>Ashok Food </h2>
<hr>
<img src="C:\Users\pc\Desktop\htmltest\t.jpeg" width="200" height="150"
alt="not found image" /><br>
<img src="C:\Users\pc\Desktop\htmltest\f1.jpeg" width="200" height="150"
alt="not found image" />
<img src="C:\Users\pc\Desktop\htmltest\m.jpeg" width="200" height="150"
alt="not found image" />
</body>
</html>

<figure> element to mark up a photo in a document,


<figcaption>:
It specifes contained content like illustrations,diagrams,photos,code….etc.
<figcaption> ttag for images.
Ex:
<html>
<head>
<title> images</title>
</head>
<body>
<h2>Ashok Food </h2>
<hr>
<figure>
<img src="C:\Users\pc\Desktop\htmltest\t.jpeg" width="200" height="150"
alt="not found image" /><br>
<figcaption>Fig 1.0</figcaption>
</figure>
</body>
</html>

Section:
It display information section wise it is used in chapters, introduction , news
items ,contact information.
Ex:
<!DOCTYPE html>
<html>
<body>

<h1>The section element</h1>

<section>
<h2>WWF History</h2>
<p>The World Wide Fund for Nature (WWF) is an international organization
working on issues regarding the conservation, research and restoration of the
environment, formerly named the World Wildlife Fund. WWF was founded in
1961.</p>
</section>

<section>
<h2>WWF's Symbol</h2>
<p>The Panda has become the symbol of WWF. The well-known panda logo
of WWF originated from a panda named Chi Chi that was transferred from the
Beijing Zoo to the London Zoo in the same year of the establishment of
WWF.</p>
</section>

</body>
</html>
<article>:
It display self-contained content.
Used in :
Forums posts
Blog posts
Product cards
News paper articles.

Ex:
<!DOCTYPE html>
<html>
<body>

<h1>The article element</h1>

<article>
<h2>Google Chrome</h2>
<p>Google Chrome is a web browser developed by Google, released in 2008.
Chrome is the world's most popular web browser today!</p>
</article>

<article>
<h2>Mozilla Firefox</h2>
<p>Mozilla Firefox is an open-source web browser developed by Mozilla.
Firefox has been the second most popular web browser since January,
2018.</p>
</article>

<article>
<h2>Microsoft Edge</h2>
<p>Microsoft Edge is a web browser developed by Microsoft, released in
2015. Microsoft Edge replaced Internet Explorer.</p>
</article>

</body>
</html>

<footer>:it display footer document.


Used in:
Authorship information,
Copyright information,
Contact information,
Sitemap information,
Related documents.

Ex:
<!DOCTYPE html>
<html>
<body>

<h1>The footer element</h1>

<footer>
<p>Author: sekhar chandra<br>
<a href="[email protected]">email</a></p>
</footer>

</body>
</html>

<textarea>: it create text area

Ex:
<html>
<head>
<title> images</title>
</head>
<body>
<textarea name="message" rows="10" cols="20">
hello student welcome to front end class</textarea>
</body>
</html>
List :

<ul> : unorder list


<ol> : order list
<li> : list of items
<ol> : tag defines an ordered list.
An ordered list can be numerical or alphabetical.
Each list item starts with the <li> tag.

Type Description

type="1" The list items will be numbered with numbers (default)

type="A" The list items will be numbered with uppercase letters

type="a" The list items will be numbered with lowercase letters

type="I" The list items will be numbered with uppercase roman


numbers

type="i" The list items will be numbered with lowercase roman numbers

EX:
<html>
<head>
<title>Course List</title>
</head>
<body >
<h2>List of course:</h2>
<ol type="i">
<li>ms office</li>
<li>python</li>
<li>c</li>
<li>c++</li>
<li>html</li>
</ol>
</body>
</html>

<ul> :
tag defines an unordered (bulleted) list.

The CSS list-style-type property is used to define the style of the list item
marker. It can have one of the following values:

Value Description

disc Sets the list item marker to a bullet (default)

circle Sets the list item marker to a circle

squar Sets the list item marker to a square


e

none The list items will not be marked

Ex:
<html>
<head>
<title>order list</title>
</head>
<h2>COURSE LIST</h2>
<body>
<ul type="square">
<li>python</li>
<li>html</li>
<li>css</li>
<li>js</li>
</ul>
</body>
</html>

Nested List:

Ex:
<html>
<head>
<title>order list</title>
</head>
<h2>COURSE LIST</h2>
<body>
<ol type="I">
<li>c</li>
<li>java</li>
<li> python</li>
<ul type="circle">
<li>motor cycle</li>
<li> bike</li>
</ul>
</ol>
</body>
</html>

Table:
It is combination of rows of and columns.
To enter the heading we can use <th>(table header)
To create the row we can use <tr> (table row)
To enter the data in table using <td>(table data)
Create the table by using <table>
Ex:
<html>
<head>
<title>Table</title>
</head>
<body>
<table border="2" bgcolor="yellow">
<tr style="color:green">
<th >ENO</th>
<th>Ename</th>
<th>Sal</th>
<th>Dept</th>
</tr>
<tr style="color:red">
<td>121</td>
<td>ram</td>
<td>234666</td>
<td>Manger</td>
</tr>
<tr style="color:red">
<td>234</td>
<td>sekhar</td>
<td>546545</td>
<td>cleark</td>
</tr>
</table>
</body>
</html>
<dl> tag defines a description list
<dt> Define Term
Ex:

You might also like