Scribd
Upload
6 views11 pages

It

The document contains multiple HTML pages showcasing various topics including Symbiosis Junior College, tourist places, traveller information, audio and video formats, and an image map with links. Each section includes relevant forms, lists, and multimedia elements. The content emphasizes educational opportunities, travel details, and multimedia capabilities.

Uploaded by

aamukthaaa
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
6 views11 pages

It

The document contains multiple HTML pages showcasing various topics including Symbiosis Junior College, tourist places, traveller information, audio and video formats, and an image map with links. Each section includes relevant forms, lists, and multimedia elements. The content emphasizes educational opportunities, travel details, and multimedia capabilities.

Uploaded by

aamukthaaa
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 11

SOP1

Input:

Page 1

<!DOCTYPE html>

<head>

<title> SYMBIOSIS JUNIOR COLLEGE </title>

</head>

<body>

<h1> SYMBIOSIS JUNIOR COLLEGE </h1>

<p> Symbiosis Junior college of Arts, Science and Commerce, established in the year 2019, under the
brilliant guidance of Sir Dr. S.B. Mujumdar, Founder, SOES, provides students a whole new experience of
learning with not only theory lectures but also practical classes.

Known for its highly skilled and qualified faculty that provides a greater exposure to students in the
fields of education using modern ideas and facilities.

Extra curriculars and cultural events of SJC are also emphasised, promoting overall student development
in fields other than studies.

</p>

<img src="C:\Users\VANSH\Desktop\sjc.jpg" alt="Image of the campus of SJC"

style="width:400px;height:auto;"><br><br>

<a href="C:\Users\VANSH\Desktop\page2.html">CLICK TO OPEN ENROLLMENT FORM</a>

</body>

</html>
Page 2

<!DOCTYPE html>

<head>

<title>Registration form</title>

</head>

<body>

<h1 align:"centre"> WELCOME TO SYMBIOSIS JUNIOR COLLEGE </h1>

<form>

Name: <input type="text" autocomplete><br><br>

Email: <input type="email" name="Email"<br><br>

Date of Birth: <input type="date" name="Date of Birth"<br><br>

Mobile number: <input type="tel" name="phone" pattern="[0-9]{2}-[0-9]{10}"<br><br>

<input type="SUBMIT" name="submit">

</form>

</body>

</html
Sop2
<!DOCTYPE html>

<head>

<title> TOURIST PLACES </title>

<style>

section{background-color: yellow; width:50%; height:50%; float: left; color: black; font-size: 30px;
outline-style: solid;}

aside{background-color: pink; width:50%; height:50%; float: right; color: black; font-size: 30px; outline-
style: solid;}

header{background-color: lightblue; width:100%; height:30%; text-align:center; color:white; font-size:


50px; outline-style:solid;}

</style>

</head>

<body>

<header>TOURIST PLACES</header>

<section>

<b>Cities</b>

<ol>

<li>Pune</li>

<li>Bangalore</li>

<li>Hyderabad</li>

<li>Delhi</li>

</ol>

</section>

<aside>

<p>Tourist Places in Pune</p>


<ul>

<li>Shanivaar Wada</li>

<li>Kelkar Museum</li>

<li>Sinhgad Fort</li>

</ul>

</aside>

</body>

</html>
Sop 3
Page 1

<!DOCTYPE html>

<head>

<title>Traveller information</title>

<link rel="stylesheet" type="text/css" href="style.css">

</head>

<body bgcolor="lightblue">

<form>

Name of the Traveller: <input type="text" name="traveller_name"><br><br>

Date of travelling: <input type="date" name="date of travel"><br><br>

Telephone number: <input type="tel" name="contact"><br><br>

<input type="SUBMIT" name="submit"><br><br>

<a href="C:\Users\VANSH\Desktop\sop3page2.html">CLICK TO CHECK FLIGHT DETAILS</a>

</form>

</body>

</html>

Page 2

<!DOCTYPE html>

<head>

<title>Flight details</title>

</head>

<body>

<h1>FLIGHT DETAILS</h1>
<div>

<ul>

<li>Name of transporter – Air Asia</li>

<li>Time - 09:30 am</li>

<li>Seat no – B39</li>

<li>Destination - Delhi</li>

</ul>

<input type="submit" name="submit" value="BACK" onclick="history.back();">

</div>

</body></html>
Sop5
1st]

<!DOCTYPE html>

<head>

<title>audio</title>

</head>

<body align="center">

<h1>AUDIO WITH LOOP</h1>

<audio controls autoplay loop>

<source src="C:\Users\VANSH\Downloads\Main Hoon Don Don 2006 128 Kbps.mp3"


type="audio/MP3">

</audio>

</body>

</html>

2]

<!DOCTYPE html>

<head>

<title>audio</title>

</head>

<body>

<h1 align="center">AUDIO WITH MULTIPLE FORMATS</h1>

<h3> List of audio file formats </h3>

<ol>
<li>audio.mp3</li>

<li>audio.ogg</li>

<li>audio.wav</li>

</ol>

<audio controls>

<source src="C:\Users\VANSH\Downloads\Main Hoon Don Don 2006 128 Kbps.mp3"


type="audio/mp3">

<source src="C:\Users\VANSH\Downloads\file_example_OOG_1MG.ogg" type="audio/ogg">

<source src="C:\Users\VANSH\Downloads\file_example_WAV_1MG.wav" type="audio/wav">

</audio>

</body>

</html>
Sop6
1]

<!DOCTYPE html>

<head>

<title>video</title>

<style>

video {width:300px; height:300px;}

</style>

</head>

<body>

<h1> Video file playing automatically </h1>

<video controls autoplay>

<source src="C:\Users\VANSH\Downloads\file_example_MP4_480_1_5MG.mp4" type="video/mp4">

</video>

</body>

</html>

2]

<!DOCTYPE html>

<head>

<title>video</title>

<style>

video {width:300px; height:300px;}

</style>

</head>
<body>

<h1 align="center">VIDEO WITH MULTIPLE FORMATS</h1>

<h3> List of video file formats </h3>

<ol>

<li>video.mp4</li>

<li>video.webm</li>

<li>video.wmv</li>

</ol>

<video controls >

<source src="C:\Users\VANSH\Downloads\file_example_MP4_480_1_5MG.mp4" type="video/mp4">

<source src="C:\Users\VANSH\Downloads\file_example_WEBM_480_900KB.webm"
type="video/webm">

<source src="C:\Users\VANSH\Downloads\file_example_WMV_480_1_2MB.wmv" type="video/wmv">

Your browser does not support the video tag.

</video>

</body>

</html>
Sop7
<!DOCTYPE html>

<head>

<title> IMAGE MAP </title>

</head>

<body>

<h1>IMAGE MAP WITH LINKS</h1>

<img src="C:\Users\VANSH\Desktop\sjc.jpeg" usemap="#imagemap" alt="SYMBI COVER">

<map name="imagemap">

<area href="https://www.google.co.in/" shape="rect" coords="0,10,23,45" alt="GOOGLE SITE">

<area href="https://symbiosisjrcollege.ac.in/" shape="circle" coords="340,364,290" alt="SYMBIOSIS


SITE">

<area href="https://www.netflix.com/in/" shape="poly" coords="400,230,190,240,265" alt="NETFLIX


SITE">

</map>

</body>

</html>

You might also like