Aim :

To create a web page using paragraph alignment,line breaks and basic HTML tags.
Procedure :
Step 1 :
Create a HTML file using the Text Editor.
Step 2 :
Use the align attribute within text related tags like <p> or <h1> tags to set the
alignment.
Step 3 :
Left Alignment align the text in the left side of the web page.
Right Alignment align the text in the right side of the web page.
Center Alignment align the text in the center of the web page.
Justify Alignment is used to align the text on both the left and right margins of a page.
Step 4 :
To create a break in the line of text, <br> tag is used.
Step 5 :
<b> for bold – Makes the text stand out with added weight.
<i> for italic – Gives the text a slight tilt for emphasis or style.
<u> for underline – Draws the attention by adding a line below your text.
Step 6 :
The <p> element defines a paragraph. A paragraph always starts on a new line and
browsers automatically add some new space before and after a paragraph.
Step 7 :
Save the document with the extension of .html in a required location.
Step 8 :

Open the program in the web browser an view the webpage.

Result :
Thus the web page has been created using basic HTML tags and executed successfully.
Aim :
To create a table in a web page using HTML.
Procedure :
Step 1 :
An HTML table is created with an opening <table> tag and a closing </table> tag.
Step 2 :
Use the <tr> element to create table rows.
Step 3 :
The <th> element defines table headers(column labels).
Step 4 :
Use the <td> element to create table cells(data).
Step 5 :
Insert the desired data within the table cells.
Step 6 :
Save the file with .html file extension and open it in a web browser to view the table.

Result :
Thus the table can be created in a web page using HTML.
Aim :
To create a web page using HTML lists to group a set of related items in lists.
Procedure :
In HTML , We can create three type of list :
Step 1 :
Ordered List – An HTML ordered list starts with the <ol> tag and ends with the </ol> tag.
Each list item starts with the <li> tag. The list items will be marked with numbers by default.
Step 2 :
Unordered List - An HTML ordered list starts with the <ul> tag and ends with the </ul> tag.
Each list item starts with the <li> tag. The list items will be marked with bullets by default.
Step 3 :
Description List – A Description list is a list of terms with a description of each term.
<dl> tag – defines the description list.
<dt> tag – defines the term(name)
<dd> tag – describes each term.
Step 4 :
Save the program with .html file extension and open it in a web browser to view the list of
items.

Result :
Thus the web page has been created to view the list of ltems and executed successfully.
Aim :
To create a web page using the forms and controls in HTML.
Procedure :
Step 1 :
The HTML <form> element is used to create an HTML form for user input . The <form>
element is a container for different types of input elements such as textfields , checkboxes ,
radio buttons , submit buttons etc.
Step 2 :
The HTML <input> element is the most used form element.
Step 3 :
The <input type=”radio”> defines a radio button. Radio Button allows the user to select
ONE of a limited number of choices.
Step 4 :
The <input type=”checkbox”> defines checkbox. Checkboxes allows a user to select zero or
more options of a limited number of choices.
Step 5 :
The <input type=”submit”> defines a button for submitting the form data to a form handler.
Step 6 :
Save the program in .html file extension and view the content in the web browser.

Result :
Thus the webpage has been created using forms and controls and executed successfully.

Aim :
 To create a table using CSS and HTML and customize it by adding different styles to the
table.
Procedure :
Create the table using CSS with the following steps:
Step 1:
To specify the table border in CSS, use the border property. We can specify a solid border
for<table>,<th> and<td> elements.
Step 2:
To span the content, add width :100% to the <table> element.
Step 3 :
The CSS margin properties are used to create space around elements , outside of any
borders. There are properties for setting the margin for each element(top,right,bottom and
left).
Step 4:
The background-color property can be applied to a <table>,<tr>,<td> element. The CSS color
property also sets the foreground color value of an elements text .
Step 5:
The Padding property may be specified using one,two,three or four values. When one value
is specified , it applies the same padding to all the four sides.
Step 6 :
Save the program with .html file extension and open it in the Web browser.

Result :
Thus the table has been created using CSS and executed successfully.

Aim :
To create a Photo Album using HTML.
Procedure :
Step 1 :
Download the images and place it in a required location.
Step 2:
The src is the file pathway of the image . Use the img tag to add each image on the web
page.
Step 3 :
Create a div container to hold the Gallery.
Step 4 :
Specify backcolor, font color, margin and padding for the <body> element using CSS.
Step 5 :
Specify the different style properties for container,photo-grid and photo grid img.
Step 6:
Save the program with .html file extension and run the program.

Result :
Thus the Photo Album has been created successfully using HTML and CSS.

Aim :
 To create a elegant banner using HTML and CSS.
Procedure :
Step 1 :
Define the banner size and format based on the platforms requirements where it will be
displayed.
Step 2 :
Use a text editor or specialized HTML editor to write the banner’s HTML and CSS code.
Step 3:
Use images to optimize our ideas for the web and incorporate any active elements in to the
banner.
Step 4 :
Specify the different style property such as padding,margin,width,height,color for the
element of containerand banner .
Step 5 :
Save the program with .html file extension and run the program in the web browser.

Result :
Thus the banner has been created successfully using HTML and CSS.

Aim :
To create a button using HTML, CSS and Javascript.
Procedure :
Step 1 :
Use the button tag to create a button.
Step 2 :
Inside a button element we can add tags like <i>,<b>,<strong>,<br>,<img> etc.
Step 3 :
Specify the type attribute for a <button> element, to tell browsers what type of button it is.
Step 4 :
Call a function inside the button tag to display a alert message.
Step 5 :
Specify the CSS style property such as padding, font-size, border, cursor, transition, margin-
top for the <button> element.
Step 6 :
Save the program using .html file extension and run the program in the web browser.

Result :
Thus the button has been created successfully using HTML and CSS.