Skip to content

Create multimedia.html for the home work #264

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Create multimedia.html for the home work #264

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
159 changes: 159 additions & 0 deletions Video 12/multimedia.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,159 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<title>Video Audio sample</title>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<link rel='stylesheet' type='text/css' media='screen' href='main.css'>
<script src='main.js'></script>
</head>
<body>
<header>
<h1>My Multimedia Collection</h1>
<p>Welcome to my multimedia collection! Here you can find a variety of audio and video files that I have curated for your enjoyment. Feel free to explore and listen or watch as you please.</p>
<p>All files are in MP3, OGG, MP4, and OGV formats for your convenience.</p>
</header>

<nav>
<ul>
<li>
<a href="#audio-files">Listen audio</a>
</li>
<li>
<a href="#video-files">Watch video</a>
</li>
</ul>
</nav>

<main>
<section id="audio-files">
<h2>My Audio Collection</h2>
<article class="audio-item">
<h3>Afterhours - Weekend</h3>
<audio controls>
<source src="audio/01.mp3" type="audio/mpeg">
<source src="audio/01.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="audio-item">
<h3>Brats - Arjan Dhillon</h3>
<audio controls>
<source src="audio/02.mp3" type="audio/mpeg">
<source src="audio/02.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="audio-item">
<h3>Aura - Shubh</h3>
<audio controls>
<source src="audio/03.mp3" type="audio/mpeg">
<source src="audio/03.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="audio-item">
<h3>Archangel - DJ Anemia</h3>
<audio controls>
<source src="audio/04.mp3" type="audio/mpeg">
<source src="audio/04.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="audio-item">
<h3>Swim - Chase Atlantic</h3>
<audio controls>
<source src="audio/05.mp3" type="audio/mpeg">
<source src="audio/05.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="audio-item">
<h3>Run It Up - HanumanKind</h3>
<audio controls>
<source src="audio/06.mp3" type="audio/mpeg">
<source src="audio/06.ogg" type="audio/ogg">
Your browser does not support the audio element.
</audio>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>

</section>

<section id="video-files">
<h2>My Video Collection</h2>
<article class="video-item">
<h3>Video 1</h3>
<video controls>
<source src="video/01.mp4" type="video/mp4">
<source src="video/01.ogg" type="video/ogg">
Your browser does not support the video element.
</video>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="video-item">
<h3>Video 2</h3>
<video controls>
<source src="video/02.mp4" type="video/mp4">
<source src="video/02.ogg" type="video/ogg">
Your browser does not support the video element.
</video>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="video-item">
<h3>Video 3</h3>
<video controls>
<source src="video/03.mp4" type="video/mp4">
<source src="video/03.ogg" type="video/ogg">
Your browser does not support the video element.
</video>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="video-item">
<h3>Video 4</h3>
<video controls>
<source src="video/04.mp4" type="video/mp4">
<source src="video/04.ogg" type="video/ogg">
Your browser does not support the video element.
</video>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="video-item">
<h3>Video 5</h3>
<video controls>
<source src="video/05.mp4" type="video/mp4">
<source src="video/05.ogg" type="video/ogg">
Your browser does not support the video element.
</video>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
<article class="video-item">
<h3>Video 6</h3>
<video controls>
<source src="video/06.mp4" type="video/mp4">
<source src="video/06.ogg" type="video/ogg">
Your browser does not support the video element.
</video>
<p>Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aliquid repudiandae incidunt natus dolore? Quae dignissimos voluptate, autem numquam illo nesciunt molestiae quasi quia.</p>
</article>
</section>
</main>

<footer>
<p>&copy; 2025 Rohit Kumar. All rights reserved</p>
<Address>
<p>Contact: <a href="mailto:[email protected]">[email protected]</a></p>
<p>Phone: <a href="tel:+917992241733">+91 7992241733</a></p>
<a href="https://maps.app.goo.gl/CYQHiU314en1udiZ7" target="_blank" rel="noopener noreferrer">Location 📍</a><br>
<p>Salimpur Ahra, Gandhi Maidan</p>
<p>Patna, Bihar-800003</p>
</Address>
</footer>
</body>
</html>