SOP 3 :

Create a website using HTML and CSS code to design webpages as follows -

1) The first webpage will accept the name of the traveller, date of travel , telephone number . It also has submit button as an image .
Create a file "SOP3.html"

Code :


<!Doctype HTML>
<HTML>
<Head>
<title>Make my Trip</title> 
<link rel="stylesheet" type="text/css" href="style.css">
</Head>
<Body>
<H1 align="center">Make my Trip</H1>
<br><br>
<Form name="F1" align="center">
Name of traveller : <Input type="text" name="N1">
<br><br>
Date of travel: <Input type="date" name="N2">
<br><br>
Telephone Number : <Input type="number" name="N3"></textarea>
<br><br>
<Input type="image" value="Submit">
<br><br>
<a href="secondepage.html">Click here to view transporter's in formation</a>
</Form>
</Body>
</Html>

2) The second webpage has information about the name of transporter, time , seat no and destination displayed one below the other in the form of unordered list as
Name of transporter – Air Asia
Time - 09:30 am
Seat no – B39
Destination - Delhi
Both pages should be interlinked. Create external stylesheet with relevant tags.
Create a file "secondepage.html"

Code :


<!Doctype HTML>
<HTML>
<Head>
<title>Make my Trip</title> 
<link rel="stylesheet" type="text/css" href="style.css">
</Head>
<Body>
<H1 align="center">Make my Trip</H1>
<br><br>
<ul style="list-style: circle;">
<li> Name of transporter – Air Asia
<li> Time - 09:30 am
<li> Seat no – B39
<li>  Destination - Delhi
</ul>
<br><br>
<a href="SOP3.html" >Click here to go back </a>
</Body>
</Html>

3) CSS
Create a file "style.css"

Code :


H1{color: red ;}
Body{background-color: pink ;}