MWA Programs
MWA Programs
. <head>
<title>My Webpage</title>
</head>
<body>
This is my first Web Page!!!
</body>
</html>
2 The comment in HTML can be denoted as
. follows –
<!—It is a comment statement-->
3 <!DOCTYPE html>
. <html>
<head>
</head>
<body>
<h1>This is a first header</h1>
<h2>This is a second header</h2>
<h3>This is a third header</h3>
<h4>This is a forth header</h4>
<h5>This is a fifth header</h5>
<h6>This is a sixth header</h6>
</body>
</html>
4 <p> tag: This tag should be put at the end of
. every paragraph.
<html>
<head>
</head>
<body>
<p>
Once upon a time, there was a king who
kept a monkey as a pet. The monkey served
the king by all the possible ways.
</p>
<div>
It was very hot in those days. So one day,
when the king was sleeping, monkey was
fanning the king. Suddenly monkey noticed
a fly on the chest of the king. The monkey
tried to swish it away. But fly would go away
for one moment and come back again
</div>
<div>
So monkey decided to teach a lesson to the
fly.
</div>
<pre>
The monkey then looked for something to
hit a fly. It then found a stick. It picked up
the stick and tried to beat the fly using stick.
Hmmm at last it found a fly and with all the
force it hit the fly as a result of which the
king died.
Lesson from the story: Never keep a fool
servant!!!
</pre>
</body>
</html>
5 Line Break
For the line break the <br> tag is used. This
is a single line break tag. Generally this tag
is kept at the end of every line.
<!DOCTYPE html>
<html>
<head>
<title>Line Break Demo</title>
</head>
<body>
<p>
Here the line breaks
and new line starts. Again line
breaks<br>Bye.
</p>
</body>
</html>
TAG PURPOSE
<b> </b> Displays the text
in bold
<i> </i> Displays the text
in italics
<strong> Displays the text
</strong> in bold
<strike> Displays the text
</strike> with strike
<!DOCTYPE html>
<html>
<head>
<title>Font Style Demo</title>
</head>
<body>
<b>This is a bold text</b>
<i>This is in italics</i>
<strong>This is strongly emphasized
text</strong><br>
<strike>This is striked text</strike>
<center>This will appear at the
center</center><br>
</body>
</html>
7 Text Alignment
.
We can align the text at left, right or at the center using a <div> tag. Here is a HTML
program which shows the text aligned left, right and centre.
<!DOCTYPE html>
<html>
<head>
<title>Text Alignment</title>
</head>
<body>
<div align=”center”>This is aligned at
center</div>
<div align=”left”>This is aligned at
left</div>
<div align=”right”>This is aligned at
right</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Font styles for text</title>
</head>
<body>
<basefont face=”arial” size=”10”>
Varsha is sweet and <br>
Jayashree is very naughty!!<br>
But Sachin is a serious guy<br>
And Rashmi is a new-comer in this
group<br>
</body>
</html>
ColorFont.html:
<!DOCTYPE html>
<html>
<head>
<title>coloring the text</title>
</head>
<body>
<basefont face=”arial” size=”10”
color=”blue”>
Great people are simple and<br>
<font face=”Times new roman” color=”red”
size=”8”>
Simple people are great!!!<br>
<font face=”GoudyHandtooled BT”
color=”green” size=”14”>
Great people rule the world.
</body>
</html>
Script Explanation :
1) In the above HTML document, we
have used font face tag to set the font.
2) Using the attributes color and size we
can specify values color and size in
double quotes. We can set the
background color of the web page using
the attribute bgcolor. Following program
sets the background color of the web
page to red.
<!DOCTYPE html>
<html>
<head>
<title>coloring the background</title>
</head>
<body bgcolor=”#FFFF00”>
<h3>This is document has colored
background</h3>
</body>
</html>
Script Explanation :
1) In above document we have specified
background color using the bgcolor
attribute.
2) The color can be specified by either
using the color name in double quotes or
using the hex.code as given in above
document.
3) The first two digits of Hex code
represents the Red value, then next two
digits specify the green value and final
two digits specify the blue value.
Note that the background color is specified
by the hexadecimal value. Following table
shows the hex. and corresponding decimal
values –
Deci Hexade
mal cimal
Value Value
1 1
2 2
3 3
4 4
5 5
6 6
7 7
8 8
9 9
10 A
11 B
12 C
13 D
14 E
15 F
<!DOCTYPE html>
<html>
<head>
<title>Space Demo</title>
</head>
<body>
<h3>
Method1:
</h3>
<p>
Jony Jony Yes Papa&
nbsp; Eating&
nbsp;sugar no Papa &n
bsp; Open Your 
;mouth  
; Ha!Ha!Ha
</p>
<h3>
Method 2:
</h3>
<p>
Jony Jony Yes Papa Eating sugar no papa
Open Your mouth Ha!Ha!Ha!
</p>
</body>
</html>
1 Uses of Links
3 Following are the uses of the hyperlinks for
. a web document –
1. One can link logically related documents
together using the links in the web page.
2. Use of link enhances the readability of the
web document.
3. User can click on the link and can learn
more about a subtopic and then can return
to the main topic. This navigation within the
web pages is possible due to the links.
1 Lists
4 List is nothing but the collections of
. items or elements. There are two types of
lists - unordered lists and ordered lists.
The unordered list is useful for simply
listing the items but if we want the items
in some specific sequence then the
ordered lists are used. Let us discuss how
to use these types lists in the HTML
document.
Unordered List
Following HTML document makes use of
unordered list.
Basic HTML
Tag Description
<bdi> Isolates a part of text that might be formatted in a different direction from
other text outside it
<u> Defines some text that is unarticulated and styled differently from normal
text
<var> Defines a variable
Frames
Tag Description
Images
Tag Description
<canvas> Used to draw graphics, on the fly, via scripting (usually JavaScript)
Audio / Video
Tag Description
<source> Defines multiple media resources for media elements (<video>, <audio>
and <picture>)
<track> Defines text tracks for media elements (<video> and <audio>)
Links
Tag Description
Lists
Tag Description
Tables
Tag Description
<col> Specifies column properties for each column within a <colgroup> element
<details> Defines additional details that the user can view or hide
Meta Info
Tag Description
Programming
Tag Description
<noscript> Defines an alternate content for users that do not support client-side scripts
Valign top, middle, bottom Vertically aligns tags within an HTML element.
Width Numeric Value Specifies the width of tables, images, or table cells.
Height Numeric Value Specifies the height of tables, images, or table cells.
Value Meaning
Rtl Right to left (for languages such as Hebrew or Arabic that are read right to left)
The HTML <body> tag also supports the following additional attributes −
Link rgb(x,x,x) Deprecated − Specifies the color of all the links in the
#xxxxxx document.
colorname
Following tags have been introduced in older versions of HTML but all the tags marked with are part of
HTML-5.
Cords if shape = "rect" then coords = "left, top, right, bottom" Specifies the
coordinates
if shape = "circ" then coords = "centerx,centery,radius"
appropriate to
if shape = "poly" then coords = "x1, y1, x2, y2,..,xn,yn" the shape
attribute to
define a
region of an
image for
image maps.
_self - the
target URL will
open in the
same frame as
it was clicked.
_parent - the
target URL will
open in the
parent
frameset.
_top - the
target URL will
open in the
full body of
the window.
<base>
Href URL Specifies the URL of a page or the name of the anchor that
the link goes to.
Unordered List
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<ul type="disc">
<li>DOS</li>
<li>Windows 98</li>
<li>Windows XP</li>
<li>Windows Professional</li>
<li>Windows Vista</li>
<li>Unix</li>
</ul>
<ul type="circle">
<li>Operating system</li>
<li>Computer Network</li>
<li>Web Programming</li>
<li>Software Engineering</li>
</ul>
<li>Intenet Explorer</li>
<li>Mozilla Firefox</li>
<li>Netscape Navigator</li>
</ul>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title> Ordered List Demo </title>
</head>
<body>
<h4>This is a typical List</h4>
<ol type="A">
<li>First</li>
<li>Second</li>
<li>Third</li>
<li>Forth</li>
<li> and so on</li>
</ol>
<h4>The list is starting from 5</h4>
<ol start="5">
<li>Ice cream</li>
<li>Mango</li>
<li>Juice</li>
<li>Pop Corn</li>
<li> and so on</li>
</ol>
</body>
</html>
Tables
For systematic arrangement of information we often require tabular structure. HTML allows us
to create tables on the web pages.
Many web designers are using invisible tables on the web pages.
The biggest advantage of using tables on the web pages is that the information gets arranged
systematically.
The table is a matrix of rows and columns and the area formed due to intersection of a row and a
column is called cell.
2.8.1 Basic Table Tag
To create a table on the web page the table beginning tag is <table> and </table> tag is used for
ending the table.
Within <table> … </table> tag we can create rows and columns.
The rows are created using <tr> </tr> and columns are created using <td> </td>
Example
HTML Document[TabDemo.html]
<!DOCTYPE html>
<html>
<head>
<title> Table Demo </title>
</head>
<body>
<br/><br/>
<center>
<table border="5">
<caption align="bottom">
<b> Table Demo </b>
</caption>
<tr>
<td>This is Left cell-row 1</td>
<td>This is Right cell -row 1</td>
</tr>
<tr>
<td>This is Left cell-row 2</td>
<td>This is Right cell-row 2</td>
</tr>
</table>
</center>
</body>
</html>
Sol. :
<html>
<head>
<title>My Table</title>
</head>
<body>
<table border=1>
<tr>
<td rowspan="3">
<p align=center>Sr.No.</p>
<p> </td>
</td>
<td colspan="4">
<p align="center">College Name</p>
<
d>
<
/t
r>
<
tr
/t
>
<td width="40%" colspan="2" align="center">Section A</td>
<td width="40%" colspan="2" align="center">Section B</td>
<
r>
<
tr
>
<td align="center">X</td>
<td align="center">Y</td>
<td align="center">X</td>
<td align="center">Y</td>
<
/t
r>
<
tr
>
<td align="center">1</td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
<
/t
r>
<
tr
>
<td align="center">2</td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
</tr>
<tr>
<td align="center">3</td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
<td align="center"> </td>
</tr>
</table>
</body>
</html>
FORMS:
Form is a typical layout on the web page by which a user can interact
with the web page.
Typical component of forms are text, text area, checkboxes, radio
buttons and push buttons.
HTML allows us to place these form components on the web page and
send the desired information to the destination server.
All these form contents appear in the <form> tag. The form has an
attribute action which gets executed when user clicks a button on the
form.
Various attributes of form are –
Attribute Description
Action It specifies the url where the form should be submitted.
Method It specifies the HTTP methods such as GET, POST
Name This attribute denotes the name of the form.
target It specifies the target of the address in the action attribute.
Let us learn various form components with the help of simple HTML
documents.
Text:
Text is typically required to place one line text. For example if you
want to enter some name then it is always preferred to have Text field
on the form.
The text field can be set using
<input type="text" size=”30” name =”username” value=" ">
The input type is text and the value of this text field is “ ” That means
the blank text field is displayed initially and we can enter the text of
our choice into it. There is size parameter which allows us to enter
some size of the text field.
Some other parameters or attributes can be
maxlength that allows us to enter the text of some maximum length.
name indicates name of the text field.
align denotes the alignment of the text in the text field. The alignment
can be left, right, bottom and top.
Example:
<html xmlns=https://www.w3.org/1999/xhtml>
<head>
<title>My Page</title>
</head>
<body>
<form>
<b>Input String:</b><input type=”text” size=”25” value=” “>
</form>
</body></html>
Ex: Password type
<form name=”form1”>
Password:<input type=”password”/>
</form>
Text Area
Text field is a form component which allows us to enter single line
text, what if we want to have multiple line text? Then you must use
textarea component.
<!DOCTYPE html>
<html>
<head>
<title>My Page</title>
</head>
<body>
<form>
Enter the Desired text here
<textarea cols="40" rows="5" name="myname">
</textarea>
</form>
</body>
</html>
Various parameters that can be set for the text area can be
row denotes total number of rows in the text area.
col specifies total number of columns in the text area.
name denotes the name of the text area which can be utilised for
handling that component for some specific purpose.
wrap can be virtual or physical. If the wrap is virtual then the line
breaks get disappeared when the text is actually submitted to the
server. But if the wrap is assigned to the physical then the line breaks
(if any) appear as it is in the text.
Checkbox
It is the simplest component which is used particularly when we want to
make some selection from several options.
For having the checkbox we have to specify the input type as checkbox. For
example
Ex:
<!DOCTYPE html>
<html>
<head>
<title>My Form with Check box</title>
</head>
<body>
<form name ="checkboxForm">
<div align="center"><br>
Select the fruit(s) of your choice<br/>
<input type="checkbox" name="option1" value="mango"
checked="checked">Mango<br/>
<input type="checkbox" name="option2" value="apple">Apple<br/>
<input type="checkbox" name="option3" value="guava">Guava<br/>
</div>
</form>
</body>
</html>
Radio Button
This form component is also use to indicate the selection from several
choices.
Using input type=“radio” we can place radio button on the web page.
This component allows us to make only one selection at a time.
We can create a group of some radio button component.
Following HTML document displays the radio buttons for two different
groups.
Ex:
<!DOCTYPE html>
<html >
<head>
<title>My Form with radio buttons Page</title>
</head>
<body>
<form name="myform">
<div align="left"><br>
<b>Select Fruit which you like the most</b><br/>
<input type="radio" name="group1" value="Mango">Mango<br/>
<input type="radio" name="group1" value="Apple" checked> Apple<br/>
<input type="radio" name="group1" value="Grapes"> Grapes
<br/><br/><br/>
<b>Select Flower which you like the most</b><br/>
<input type="radio" name="group2" value="Rose"> Rose<br/>
<input type="radio" name="group2" value="Lotus">Lotus<br/>
<input type="radio" name="group2" value="Jasmine"
checked>Jasmine<br/>
</div>
</form>
</body>
</html>
Button
We can create the button using <input type =”button”> tag.
There are two types of buttons that can be created in HTML. One is called
submit button and the another one is reset button.
Various parameters of submit button are
1) name denotes the name of the submit button.
2) value is for writing some text on the text on the button.
3) align specifies alignment of the button.
Ex:
<!DOCTYPE html>
<html >
<head>
<title> My Page </title>
</head>
<body>
<form name="myform" action="http://www.localhost.com/cgi-
bin/hello.cgi" method="POST">
<div align="center">
<br/><br/>
<input type="text" size="35" value=" ">
<br><input type="submit" value="Send">
<input type="reset" value="Reset"><br>
</div>
</form>
</body>
</html>
Menus
HTML allows us to have pop down menu on the web page so that the
desired selection can be made.
The parameter select is for the menu component and option
parameter is for setting the values to the options of drop down menu.
We can make some specific option selected by selected value = .
In the following HTML document we have created one drop down
menu in which various fruits are enlisted. By default “Banana” is set as
selected.
Ex:
<!DOCTYPE html>
<html >
<head>
<title> My Page </title>
</head>
<body>
<form name="myform">
<div align="center">
<select name="My_Menu">
<option value="Mango">Mango</option>
<option value="Strawberry">Strawberry</option>
<option selected value="Banana">Banana </option>
<option value="Apple">Apple</option>
</select>
</div>
</form>
</body>
</html>
Ex1:
<form action="mailto:[email protected]">
Name: <input name="Name" value="" size="10"><br>
Email: <input name="Email" value="" size="10"><br>
<center><input type="submit"></center>
</form>
Ex2:
<input> input field
Example 1:
<form method=post action="/cgibin/example.cgi">
<input type="text" size="10" maxlength="30">
<input type="Submit" value="Submit">
</form>
Example 2:
Example 3:
Example 6:
<form method=post action="/cgibin/example.cgi">
Select an option: <br>
<input type="radio" name="option"> Option 1
<input type="radio" name="option" checked> Option 2
<input type="radio" name="option"> Option 3
<br> <br>
Select an option: <br>
<input type="checkbox" name="selection">
Selection 1
<input type="checkbox" name="selection" checked> Selection 2
<input type="checkbox" name="selection"> Selection 3
<input type="Submit" value="Submit">
</form>
Ex3:
<marque bgcolor=”#cccccc” loop=”-1” scrollamount=”2”
width=”100%”>Example of Marque tag</marquee>
Ex4:
<menu>
<li type="disc">List item 1</li>
<li type="circle">List item 2</li>
<li type="square">List item 3</li>
</menu>
Frames
Frame1
Frame 3
FrameSet.html
<!DOCTYPE html>
<html>
<frameset cols="25%,*,50%">
<frame src="frame1.html">
<frame src="frame2.html">
<frame src="frame3.html">
</frameset>
</html>
Create XHTML document that has two frames. The left frame displays the
contents.html and the right frame displays the cars.html where second
frame is the target of link from the first frame.
[Note : Contents.html is a list of links for the cars description]
Step 1 : We will create the basic html file that contains the left and right
frames. The HTML
document is as follows :
CarDemo.html
<!DOCTYPE html >
<html>
<head>
<title>My Frames Page</title>
</head>
<frameset cols="50%,50%">
<frame src="contents.html" name="Left_Vertical" noresize />
<frame src="Description.html" name="Right_Vertical" scrolling=no/>
</frameset>
</html>
Step 2 : Following is a HTML document that displays the contents that are
loaded at first.
The left frame HTML document is as follows –
contents.html
<!DOCTYPE html >
<html >
<head>
<title>My Frames Page</title>
</head>
<body>
<h3>
<a href="Innova.html" target="Right_Vertical">Toyota Innova</a>
<h3/>
<h3>
<a href="Scorpio.html" target="Right_Vertical">Mahindra Scorpio</a>
<h3/>
<h3>
<a href="Etios.html" target="Right_Vertical">Toyota Etios Liva</a>
<h3/>
</body>
</html>
The right frame HTML document is as follows-
Description.html
<!DOCTYPE html >
<html >
<head>
<title>My Frames Page</title>
</head>
<body>
<center>
<h3> WELCOME <h3/>
This page displays the details of a car you have chosen.
</center>
</body>
</html>
Step 3 : Following are the three html documents each containing the
description of each car.
Innova.html
<!DOCTYPE html >
<html>
<head>
<title>My Frames Page</title>
</head>
<body>
<h2> TOYOTA INNOVA</h2>
<ul type="disc">
<li>Price: Rs.9,35,731-Rs.14,82,852</li>
<li><td>Mileage: </td><td>10Kmpl(City) and 13 Kmpl(hwy)</li>
</ul>
</body>
</html>
Scorpio.html
<!DOCTYPE html>
<html >
<head>
<title>My Frames Page</title>
</head>
<body>
<h2> MAHINDRA SCORPIO</h2>
<ul type="disc">
<li>Price: </td><td>Rs.7,49,583-Rs.12,85,479</li>
<li>Mileage: </td><td>12Kmpl(City) and 16 Kmpl(hwy)</li>
</ul>
</body>
</html>
Etios.html
<!DOCTYPE html>
<html >
<head>
<title>My Frames Page</title>
</head>
<body>
<h2> TOYOTA ETIOS LIVA</h2>
<ul type="disc">
<li> Price: </td><td>Rs.4,46,276-Rs.6,86,426</li>
<li> Mileage: </td><td>17Kmpl(City) and 19 Kmpl(hwy)</li>
</ul>
</body>
</html>
Step 4 : Open the suitable web browser and invoke the
CarDemo.html(created in Step 1), the
output will be as follows –
Create a HTML document for a company home page and explain.
Sol. : For creation of this web page the frames are used.
Step 1 : The main page is created as follows -
Main.html
<?xml version = "1.0" encoding ="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<frameset rows="20%,80%">
<frame src="logo.html">
<frameset cols="30%,70%">
<frame src="menu.html">
<frame src="contents.html">
</frameset>
</frameset>
</html>
AU : May-13, Marks 16
TM
Technical Publications
- An up thrust for knowledge
Web Technology
2 - 50
HTML
Step 2 : In the main page a layout of the company home page is created.
Various html files
that are called in this HTML document are as given below -
Menu.html
<html>
<head><title>LOGO</title></head>
<body bgcolor="aqua">
<h3><a href="about.html"> About us<a/></h3>
<h3><a href="download1.html"> Free Downloads<a/></h3>
<h3><a href="download2.html"> Download Catalogue<a/></h3>
<h3><a href="download3.html">Download Orderform<a/></h3>
<h3><a href="catalogues.html">Catalogues<a/></h3>
<h3><a href="distributors.html">Distributors<a/></h3>
<h3><a href="Contacts.html">Contact Us<a/></h3>
<h3><a href="feedback.html">Feedback<a/></h3>
</body>
</html>
Logo.html
<html>
<head><title>LOGO</title></head>
<body bgcolor="magenta">
<h1><img src="books.jpg"/> Technical Publications</h1>
</body>
</html>
Contents.html
<html>
<head><title>LOGO</title></head>
<body bgcolor="khaki">
<center>
<h2>BOOKS</h2>
</center>
<p>TECHNICAL PUBLICATIONS is known for commitment to quality and
innovation. We are
Leaders in our chosen scholarly and educational markets, serving the book
Industry & Academic
Institutions.
</p>
<p>We have been in the industry for the last 18 years and are known for
the quality and scholarly
publications in Engineering books. We publish more than 1000 titles of
text books, for various
Universities across the India.
</p>
<p>We are specialized in Engineering text books and have been publishing
titles for various
Engineering branches such as Electrical, Electronics, Computer Science,
Information
Technology,Mechanical etc. and other management books.
</p>
</body>
</html>
Step 3 : Open the suitable web browser and type the address for
main.html. The output will
be as follows -
If the character does not have an HTML entity, you can use the decimal
(dec) or hexadecimal (hex) reference.
To print summation:
If the character does not have an HTML entity, you can use the decimal
(dec) or hexadecimal (hex) reference.
To print delta
ΐ 912 0390 GREEK SMALL LETTER IOTA WITH DIALYTIKA AND TONOS
ΰ 944 03B0 GREEK SMALL LETTER UPSILON WITH DIALYTIKA AND TONOS
HTML Symbols
HTML Symbol Entities
HTML symbols like mathematical operators, arrows, technical symbols and shapes, are not present on
a normal keyboard.
To add these symbols to an HTML page, you can use the HTML entity name.
If the character does not have an entity name, you can use a decimal (or hexadecimal) reference.
If you use an HTML entity name or a hexadecimal number, the character will always display correctly.
This is independent of what character set (encoding) your page uses!
Example
<p>I will display €</p>
<p>I will display €</p>
<p>I will display €</p>
I will display €
I will display €
Yourself »
∋ ∋ ∋ ni
32 space
! 33 exclamation mark
# 35 number sign
$ 36 dollar sign
% 37 percent sign
& 38 ampersand
' 39 apostrophe
( 40 left parenthesis
) 41 right parenthesis
* 42 asterisk
+ 43 plus sign
, 44 comma
- 45 hyphen
. 46 period
/ 47 slash
0 48 digit 0
1 49 digit 1
2 50 digit 2
3 51 digit 3
4 52 digit 4
5 53 digit 5
6 54 digit 6
7 55 digit 7
8 56 digit 8
9 57 digit 9
: 58 colon
; 59 semicolon
< 60 less-than
= 61 equals-to
> 62 greater-than
? 63 question mark
@ 64 at sign
A 65 uppercase A
B 66 uppercase B
C 67 uppercase C
D 68 uppercase D
E 69 uppercase E
F 70 uppercase F
G 71 uppercase G
H 72 uppercase H
I 73 uppercase I
J 74 uppercase J
K 75 uppercase K
L 76 uppercase L
M 77 uppercase M
N 78 uppercase N
O 79 uppercase O
P 80 uppercase P
Q 81 uppercase Q
R 82 uppercase R
S 83 uppercase S
T 84 uppercase T
U 85 uppercase U
V 86 uppercase V
W 87 uppercase W
X 88 uppercase X
Y 89 uppercase Y
Z 90 uppercase Z
\ 92 backslash
^ 94 caret
_ 95 underscore
` 96 grave accent
a 97 lowercase a
b 98 lowercase b
c 99 lowercase c
d 100 lowercase d
e 101 lowercase e
f 102 lowercase f
g 103 lowercase g
h 104 lowercase h
i 105 lowercase i
j 106 lowercase j
k 107 lowercase k
l 108 lowercase l
m 109 lowercase m
n 110 lowercase n
o 111 lowercase o
p 112 lowercase p
q 113 lowercase q
r 114 lowercase r
s 115 lowercase s
t 116 lowercase t
u 117 lowercase u
v 118 lowercase v
w 119 lowercase w
x 120 lowercase x
y 121 lowercase y
z 122 lowercase z
~ 126 tilde
ADVERTISEMENT
ASCII Device Control Characters
The ASCII control characters (range 00-31, plus 127) were designed to control hardware devices.
Control characters (except horizontal tab, line feed, and carriage return) have nothing to do inside an
HTML document.
ENQ 05 enquiry
ACK 06 acknowledge
BS 08 backspace
HT 09 horizontal tab
LF 10 line feed
VT 11 vertical tab
FF 12 form feed
CR 13 carriage return
SO 14 shift out
SI 15 shift in
SYN 22 synchronize
CAN 24 cancel
EM 25 end of medium
SUB 26 substitute
ESC 27 escape
FS 28 file separator
GS 29 group separator
RS 30 record separator
US 31 unit separator
<!DOCTYPE html>
<html>
<style>
span {
font-size: 100px;
</style>
<body>
</body>
</html>