Class notes
web technologies notes
- Course
- Institution
- Book
Complete notes with more example about web technologies in the internet world
[Show more]
Connected book
Book Title:
Author(s):
- Edition:
- ISBN:
- Edition:
Seller
Follow
chiranjeevijami
Content preview
WEB TECHNOLOGIESUNIT-I
Introduction to HTML:-
HTML means Hypertext Markup Language. In 1960 Ted Nelson introduced
Hypertext. HTML is a scripting language which is used to create web pages. If you are
thinking of creating your own web pages, you need to know at least basic HTML. These
HTML documents are plain text files, user can create these documents using text editor like
Notepad or Edit.
HTML is a hypertext Language because it supports font styled text, pictures, graphics
and animations and also it provides hyper links that used to browse the Internet easily. Text
becomes hypertext with the addition of links that connects other hypertext documents.
Hypertext is a text augmented with links-pointers to other pieces of text, possible else where
in the same document (internal linking) or in another document (external linking).
Rules to write HTML Code:-
Every HTML document begins with start tag is <HTML> terminates with an ending
tag is </HTML>
HTML documents should be saved with the extension .html or .htm.
A tag is made up of left operator(<), a right operator(>) and a tag name between these
two operators.
If you forget to mention the right operator(>) or if you give any space between left
operator and tag name browser will not consider it as tag.
At the same time if browser not understands the tag name it just ignores it, browser
won‟t generate any errors.
HTML language is not case sensitive, hence user can write the code in either upper
case or lower case. No difference between <HTML> and <html>
Syntax of a tag:
<Tagname [parameters=value]>
Ex: HR is a tag name that displays a horizontal ruler line.
<HR> ------------------------------------------ (No parameters, no value)
<HR ALIGN=CENTER>------------------- (Tag with parameter and value for the parameter)
<HR WIDTH=”30%” SIZE=100 ALIGN=RIGHT> ------(Tag with more parameters with
their values)
Different types of Tags:
1. Singleton tags
2. Paired tags
Singleton tag does not require an ending tag. (Ex: <HR>
Paired tag required an ending tag, which is similar to opening tag except backslash before the
tag name (Ex: <HTML> is opening tag, then ending tag is </HTML>
Comments in HTML:
An HTML comment begins with “<!--“ and ends wit<h “-->”.There should not be
a space between angular bracket and exclamation mark.
Creating HTML Page:
The Following steps are needed to create a HTML page
Step 1: Open any text editor like Notepad, Edit, Word etc.
JAYAVARDHANARAO SAHUKARU Page 1 of 31
, WEB TECHNOLOGIES
Step 2: Use the file menu to create a new document (File New) and type the following code
<HTML>
<HEAD>
<TITLE>Example1 </TITLE>
<BODY>
Hello III IT ,this is your first web page.- Raju
</BODY>
</HTML>
Step 3: Go to the file menu and choose saveas option (File->saveas) and give the name of the
file as “example1.html” under root directory(C:)( or any valid path)
Step 4: After saving, an internet explorer icon will be displayed as shown below
Step 5: Double click to execute it. The output displayed following
Basic HTML tags
1. Body tag:-
Body tag contain some attributes such as bgcolor, background etc. bgcolor is used for
background color, which takes background color name or hexadecimal number and #FFFFFF
and background attribute will take the path of the image which you can place as the
background image in the browser.
<body bgcolor=”#F2F3F4” background= “c:\amer\imag1.gif”>
2. Paragraph tag:-
Most text is part of a paragraph of information. Each paragraph is aligned to the left, right or
center of the page by using an attribute called as align.
<p align=”left” | “right” | “center”>
3. Heading tag:-
HTML is having six levels of heading that are commonly used. The largest heading tag is
JAYAVARDHANARAO SAHUKARU Page 2 of 31
, WEB TECHNOLOGIES
<h1>. The different levels of heading tag besides <h1> are <h2>,<h3>, <h4>, <h5> and
<h6>. These heading tags also contain attribute called as align.
<h1 align=”left” | “right” | “center”> ........ <h2>
4. hr tag:-
This tag places a horizontal line across the system. These lines are used to break the page.
This tag also contains attribute i.e., width which draws the horizontal line with the screen size
of the browser. This tag does not require an end tag.
<hr width=”50%”>.
5. base font:-
This specify format for the basic text but not the headings.
<basefont size=”10”>
6. font tag:-
This sets font size, color and relative values for a particular text.
<font size=”10” color=”#f1f2f3”>
7. bold tag:-
This tag is used for implement bold effect on the text
<b> ......... </b>
8. Italic tag:-
This implements italic effects on the text.
<i>… .... </i>
9. strong tag:-
This tag is used to always emphasized the text
<strong>............ </strong>
10. tt tag:-
This tag is used to give typewriting effect on the text
<tt> ......... </tt>
11. sub and sup tag:-
These tags are used for subscript and superscript effects on the text.
<sub> ............. </sub>
<sup> ............. </sup>
12. Break tag:-
This tag is used to the break the line and start from the next line.
<br>
13. & < >   ":-
JAYAVARDHANARAO SAHUKARU Page 3 of 31
, WEB TECHNOLOGIES
These are character escape sequence which are required if you want to display characters that
HTML uses as control sequences.
Example: < can be represented as <.
14. Anchor tag:-
This tag is used to link two HTML pages, this is represented by <a>
<a href=” path of the file”> some text </a>
href is an attribute which is used for giving the path of a file which you want to link.
Example 1: HTML code to implement common tags.
mypage.html
<html>
<head> <! -- This page implements common html tags -->
<title> My Home page </title>
</head>
<body >
<h1 align="center"> ST ANN‟S COLLEGE OF ENGINEERING & TECHNOLOGY</h1>
<h2 align="center"> Chirala</h2>
<basefont size=4>
<p> This college runs under the <tt>management</tt> of <font size=5> <b><i>"
SACET" & </i></b></font><br>
it is affiliated to <strong> JNTUK</strong>
<hr size=5 width=80%>
<h3> <u>< Some common tags ></u> </h3><br>
</body>
</html>
Text Styles or Cosmetic tags:- HTML provides a numerous range of tags for formatting the
text. If you want to format the text with different styles, just you include these tags one by
one before text.
<B>………</B> Bold Text
<U>……....</U> Underline Text
<I>………..</I> Displays as Italics
<EM>………</EM> For Emphasis (New Standard for Italics)
<STRONG>………</STRONG> Strong or Bold text (New Standard for Bold)
<S>……….</S> or <DEL>…….</DEL> Strikes the text
<SAMP>………</SAMP> Code sample text
<VAR>………..</VAR> Small fonts, fixed width
<ADDRESS>……..</ADDRESS> Like address model (Looks like italics)
<PRE>……..</PRE> Considers spaces, new lines etc. As it is prints the information
Scrolling Text Tag:-
<marquee> ............... </marquee> Displays scrolling text in a marquee style.
Marquee tag attributes:-
a) align: sets the alignment of the text relative to the marquee. Set to top(default), middle
or bottom.
JAYAVARDHANARAO SAHUKARU Page 4 of 31
The benefits of buying summaries with Stuvia:
Guaranteed quality through customer reviews
Stuvia customers have reviewed more than 700,000 summaries. This how you know that you are buying the best documents.
Quick and easy check-out
You can quickly pay through credit card or Stuvia-credit for the summaries. There is no membership needed.
Focus on what matters
Your fellow students write the study notes themselves, which is why the documents are always reliable and up-to-date. This ensures you quickly get to the core!
Frequently asked questions
What do I get when I buy this document?
You get a PDF, available immediately after your purchase. The purchased document is accessible anytime, anywhere and indefinitely through your profile.
Satisfaction guarantee: how does it work?
Our satisfaction guarantee ensures that you always find a study document that suits you well. You fill out a form, and our customer service team takes care of the rest.
Who am I buying these notes from?
Stuvia is a marketplace, so you are not buying this document from us, but from seller chiranjeevijami. Stuvia facilitates payment to the seller.
Will I be stuck with a subscription?
No, you only buy these notes for $4.49. You're not tied to anything after your purchase.
Can Stuvia be trusted?
4.6 stars on Google & Trustpilot (+1000 reviews)
67096 documents were sold in the last 30 days
Founded in 2010, the go-to place to buy study notes for 14 years now