Introduction To HTML

1.
INTRODUCTION TO
HTML
1. HISTORY
HTML was created by Sir Tim Berners-Lee in late 1991 but was not
officially released. It was published in 1995 as HTML 2.0. HTML 4.01
was published in late 1999 and was a major version of HTML. HTML is a
very evolving markup language and has evolved with various versions
updating. Long before its revised standards and specifications are
carried in, each version has allowed its user to create web pages in a
much easier and prettier way and make sites very efficient. Then in
1989, he composed an update proposing an Internet-based Hypertext
System for global computers. Tim Berners-Lee's idea was a model in
which users can navigate from one set of information on a computer to
another set of information on another computer.
2.VERSIONS
i) HTML 1.0 was released in 1993 with the intention of sharing
information that can be readable and accessible via web browsers. But
not many of the developers were involved in creating websites. So the
language was also not growing.
ii) Then comes HTML 2.0, published in 1995, which contains all the
features of HTML 1.0 along with that few additional features, which
remained as the standard markup language for designing and creating
websites until January 1997 and refined various core features of HTML.
iii) Then comes HTML 3.0, where Dave Raggett introduced a fresh
paper or draft on HTML. It included improved new features of HTML,
giving more powerful characteristics for webmasters in designing web
pages. But these powerful features of the new HTML slowed down the
browser in applying further improvements.
iv) Then comes HTML 4.01, which is widely used and was a successful
version of HTML before HTML 5.0, which is currently released and used
worldwide. HTML 5 can be said for an extended version of HTML 4.01,
which was published in the year 2012.
3.FEATURES
HTML is the most common used language to write web pages. It has
recently gained popularity due to its advantages such as: -
1. It is the language which can be easily understood and can be
modified.
2. Effective presentations can be made with the HTML with the help of
its all formatting tags.
3. It provides the more flexible way to deign web pages along with the
text.
4. Links can also be added to the web pages so it helps the readers to
browse the information of their interest.
5. You can display HTML documents on any platforms such as
Macintosh, Windows and Linux etc.
6. Graphics, videos and sounds can also be added to the web pages
which give an extra attractive look to your web pages.
4.STEPS
i) Open a text editor. On a computer running
the Windows operating system, you'll usually
use Notepad, or Notepad++ whereas macOS
users will use TextEdit
ii)Type in <!DOCTYPE html> and
press ↵ Enter . This tells the web browser that
this is an HTML document.
iii) Type <html> and press ↵ Enter . This opening tag for your HTML
code. iv)
Type in <head> and press ↵ Enter . This is the tag that opens your
HTML head. The HTML head information that is not usually displayed
on your web page. This information can include, the title, meta data,
CSS style sheets, and other scripting languages.
v) Type in <title>. This is the tag to add a title to your page.
vi) Type in </title>. This is the tag to close title .
vii) Type in </head>. This is the tag to close head .
viii) Type in <body>. Now you can add the body of the html file.
ix) Type in </body>. Now you close the body of the html file.
ix) Type in </html>. Now you close the html file.
2. Design a web page for TIPS. Illustrate the use of

HEAD TAG, BODY TAG and Paragraph TAG.
3. Illustration of paragraphs tags.
4.Design a web page on the following equations:

1. C2H5OH +PCL5 =C2H5CL+POCL3+HCL
2. 4H3PO3=3H3PO4+PH3
3. PCL3+CL2=PCL5
5.Design a web page on the following equations:
1. X4-2X3-3X2=0
2. 6W2-W=5
3. U2-5UQ-14=0
6.Design a web page in html to illustrate the use of

ordered list
unordered list
ordered nested list

unordered nested list
10. Generate the code for the following output with the
use of various html tags
<html>
<body>
<h1>TRINITY INSTITUTE OF PROFESSIONAL STUDIES</h1>
<p>The college offers the following courses:- </p>

<ol style="list-style-type:upper-roman;">
<li>DEPARTMENT OF COMPUTER SCIENCE OFFERS THE FOLLOWING COURSES:
<ol style="list-style-type:upper-alpha;">
<li>FULL TIME COURSE
<ul style="list-style-type: disc;">
<li>BCA</li>
<li>MCA</li>
</ul>
</li>
<li>EVENING COURSE
<li>B Tech</li>
<li>M Tech</li>
</ul>
</li>
</ol>
</li>
<li>DEPARTMENT OF MATHEMATICS OFFERS THE FOLLOWING COURSES:
<ol style="list-style-type:upper-alpha;">
<li>FULL TIME COURSE
<li>B Sc</li>
<li>M Sc</li>
</ul>
</li>
<li>Weekend Programes
<li>M Phill</li>
<li>P hd</li>
</ul>
</li>
</ol>
</li>
</ol>
</body>
</html>
11. Create output with table tag

<!DOCTYPE html>
<html>
<head>
<style>
table, th, td {
border: 1px solid black;
}
</style>
</head>
<body>
<h1>The table element</h1>
<table>
<tr>
<th>Month</th>
<th>Savings</th>
</tr>
<tr>
<td>January</td>
<td>$100</td>
</tr>
<tr>
<td>February</td>
<td>$80</td>
</tr>
</table>
</body>
</html>
12.Create the output with the help of various table tag:

<html>
<style>
table, th, td {
border:1px solid black;
}
</style>
<body>
<h2>A basic HTML table</h2>
<table style="width:100%">
<tr>
<th>Company</th>
<th>Contact</th>
<th>Country</th>
</tr>
<tr>
<td>Alfreds Futterkiste</td>
<td>Maria Anders</td>
<td>Germany</td>
</tr>
<tr>
<td>Centro comercial Moctezuma</td>
<td>Francisco Chang</td>
<td>Mexico</td>
</tr>
</table>
<p>To undestand the example better, we have added borders to the table.</p>
</body>
</html>
13.Illustrate the use of Forms and generate the output:

HTML Forms are required, when you want to collect some data from
the site visitor. For example, during user registration you would like to
collect information such as name, email address, credit card, etc.
A form will take input from the site visitor and then will post it to a back-
end application such as CGI, ASP Script or PHP script etc. The back-end
application will perform required processing on the passed data based
on defined business logic inside the application.
There are various form elements available like text fields, textarea fields,
drop-down menus, radio buttons, checkboxes, etc.
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<form>
Enter Name<input type="text"><br>
Enter email<input type="email"><br>
Enter Phone<input type="number"><br>
<input type="submit" value="Submit">
</form>
</body>
</html>
14.Illustrate the use of Frames with its various tags

and generate the output:
HTML frames are used to divide your browser window into multiple
sections where each section can load a separate HTML document. A
collection of frames in the browser window is known as a frameset. The
window is divided into frames in a similar way the tables are organized:
into rows and columns.
14.Illustrate the use of Forms with its various tags and
generate the output:
<form> It defines an HTML form to enter inputs by the used side.
<input> It defines an input control.
<textarea> It defines a multi-line input control.
<label> It defines a label for an input element.
<fieldset> It groups the related element in a form.
<legend> It defines a caption for a <fieldset> element.
<select> It defines a drop-down list.
<optgroup> It defines a group of related options in a drop-down list.
<option> It defines an option in a drop-down list.
<button> It defines a clickable button.
<html>
<head>
<title>Document</title>
</head>
<body>
<h1>This is a form</h1>
<form>
<label>Enter Name</label> <input type="text"><br>
<label>Enter email</label> <input type="email"><br>
<label>Enter Phones</label> <input type="number"><br>
<label>Select Subject</label>
<input type="radio">Maths
<input type="radio">English
<input type="radio">Accounts
<input type="radio">Economics
<input type="radio">BST
<input type="submit" value="Submit">
</form>
</body>
</html>

Introduction To HTML

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Introduction To HTML

Uploaded by

Copyright:

Available Formats

1.

2. Design a web page for TIPS. Illustrate the use of

4.Design a web page on the following equations:

6.Design a web page in html to illustrate the use of

9.Design a web page in html to illustrate the use of

<h1>TRINITY INSTITUTE OF PROFESSIONAL STUDIES</h1>

<p>The college offers the following courses:- </p>

11. Create output with table tag

<h1>The table element</h1>

12.Create the output with the help of various table tag:

<h2>A basic HTML table</h2>

13.Illustrate the use of Forms and generate the output:

14.Illustrate the use of Frames with its various tags

<form> It defines an HTML form to enter inputs by the used side.

<input> It defines an input control.

<textarea> It defines a multi-line input control.

<label> It defines a label for an input element.

<fieldset> It groups the related element in a form.

<legend> It defines a caption for a <fieldset> element.

<select> It defines a drop-down list.

<optgroup> It defines a group of related options in a drop-down list.

<option> It defines an option in a drop-down list.

<button> It defines a clickable button.

You might also like