Scribd
Upload
5 views24 pages

Sai 1

The document contains HTML code for a movie website named 'StreamBuzz', featuring a landing page and a movies page. It includes sections for a header, hero image, featured movies, genres, about us, and footer, with Bootstrap styling and carousels for displaying content. The movies page lists individual movie titles, images, and details in a structured layout.

Uploaded by

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

Sai 1

The document contains HTML code for a movie website named 'StreamBuzz', featuring a landing page and a movies page. It includes sections for a header, hero image, featured movies, genres, about us, and footer, with Bootstrap styling and carousels for displaying content. The movies page lists individual movie titles, images, and details in a structured layout.

Uploaded by

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

ASSIGNMENT 1

W.SAI CHARAN
VU21CSEN0600060

HOME PAGE CODE

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Movie Website Landing Page</title>
<link rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">

<link rel="stylesheet" href="styles.css">


</head>
<style>
/* Global Styles */
body {
font-family: Arial, sans-serif;
}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}

header {
background-color: #333;
color: white;
padding: 20px 0;
}

nav ul {
list-style-type: none;
padding: 0;
}

nav ul li {
display: inline;
margin-right: 20px;
}

nav ul li a {
color: white;
text-decoration: none;
}

.hero {
height: 500px;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
}

.hero h2 {
font-size: 36px;
}

.btn {
display: inline-block;
background-color: #ff6f61;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
text-decoration: none;
font-size: 18px;
}

.featured-movies {
background-color: #333;
padding: 50px 0;
}

.genres {
background-color: #666;
padding: 50px 0;
}

.about-us {
background-color: #333;
color: white;
padding: 50px 0;
}

.about-us p {
font-size: 18px;
}

footer {
background-color: #333;
color: white;
padding: 20px 0;
text-align: center;
}

/* Carousel Styles */
.carousel-item img {
border-radius: 5px;
}

</style>
<body>
<header>
<div class="container">
<h1>StreamBuzz</h1>
<nav>
<ul>
<li><a href="test.html">Home</a></li>
<li><a href="movies.html">Movies</a></li>
<li><a href="genres.html">Genres</a></li>
<li><a href="about us.html">About Us</a></li>
<li><a href="contact us.html">Contact Us</a></li>
</ul>
</nav>
</div>
</header>

<section class="hero" style="background-color: red;">


<div class="container" style="color: white;">
<h2>Explore the World of Cinema with Your Movie Website</h2>
<a href="#" class="btn">Discover Now</a>
</div>
</section>
<section class="featured-movies">
<div class="container">
<h2 style="color: white;">Featured Movies</h2>
<div id="movieCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="row">
<div class="col-md-4">
<img class="d-block w-100"
src="https://www.themoviedb.org/t/p/original/4sZccyDPEAlzdkGIfe20WHPQx9F.jpg" alt="First
slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100" src="https://ibomma.kalpanikfilms.com/wp-
content/uploads/2023/05/Bio-Ukushi-Featured-Image-Thumbnail.jpg" alt="Second slide"
height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://wallpapercave.com/wp/wp1851909.jpg" alt="Third slide" height="200px"
width="200px">
</div>
</div>
</div>
<div class="carousel-item">
<div class="row">
<div class="col-md-4">
<img class="d-block w-100"
src="https://imageory.clapnumber.com/albums/large/1586864868.b5.jpg" alt="Fourth slide"
height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://th.bing.com/th/id/OIP.IbiyzwoE6REISLiPVDVi2gAAAA?rs=1&pid=ImgDetMain"
alt="Fifth slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://th.bing.com/th/id/OIP.MqyBzDxHB1LTVRSfLi-0jAHaJQ?rs=1&pid=ImgDetMain"
alt="Sixth slide" height="200px" width="200px">
</div>
</div>
</div>
<div class="carousel-item">
<div class="row">
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BM2E2ODFhYjgtN2QzYy00ZjlkLTgzZjgtNDk
wODA2YWEwMDc3XkEyXkFqcGdeQXVyMTU0MDA4MDkz._V1_FMjpg_UX1000_.jpg"
alt="Seventh slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BZGJiOTQxMGYtNTdlNy00ZmYxLWIxNDYt
OGUxMWY1ZjA5NTZhXkEyXkFqcGdeQXVyMTcyNDY1NDgw._V1_FMjpg_UX1000_.jpg"
alt="Eighth slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BM2ZkZGIwZDAtNGU1ZS00NTlkLThjYjYtMj
U5MzQzNDQyMTBmXkEyXkFqcGdeQXVyODA2ODM3NDQ@._V1_UY1200_CR87,0,630,120
0_AL_.jpg" alt="Ninth slide" height="200px" width="200px">
</div>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#movieCarousel" role="button" data-
slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#movieCarousel" role="button" data-
slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</section>

<section class="genres">
<div class="container">
<h2 style="color: white;">Genres </h2>
<div id="genreCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
<div class="carousel-item active">
<div class="row">
<div class="row">
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BM2E2ODFhYjgtN2QzYy00ZjlkLTgzZjgtNDk
wODA2YWEwMDc3XkEyXkFqcGdeQXVyMTU0MDA4MDkz._V1_FMjpg_UX1000_.jpg"
alt="Seventh slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BZGJiOTQxMGYtNTdlNy00ZmYxLWIxNDYt
OGUxMWY1ZjA5NTZhXkEyXkFqcGdeQXVyMTcyNDY1NDgw._V1_FMjpg_UX1000_.jpg"
alt="Eighth slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BM2ZkZGIwZDAtNGU1ZS00NTlkLThjYjYtMj
U5MzQzNDQyMTBmXkEyXkFqcGdeQXVyODA2ODM3NDQ@._V1_UY1200_CR87,0,630,120
0_AL_.jpg" alt="Ninth slide" height="200px" width="200px">
</div>
</div>
</div>
<div class="carousel-item">
<div class="row">
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BM2E2ODFhYjgtN2QzYy00ZjlkLTgzZjgtNDk
wODA2YWEwMDc3XkEyXkFqcGdeQXVyMTU0MDA4MDkz._V1_FMjpg_UX1000_.jpg"
alt="Seventh slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BZGJiOTQxMGYtNTdlNy00ZmYxLWIxNDYt
OGUxMWY1ZjA5NTZhXkEyXkFqcGdeQXVyMTcyNDY1NDgw._V1_FMjpg_UX1000_.jpg"
alt="Eighth slide" height="200px" width="200px">
</div>
<div class="col-md-4">
<img class="d-block w-100"
src="https://m.media-amazon.com/images/M/MV5BM2ZkZGIwZDAtNGU1ZS00NTlkLThjYjYtMj
U5MzQzNDQyMTBmXkEyXkFqcGdeQXVyODA2ODM3NDQ@._V1_UY1200_CR87,0,630,120
0_AL_.jpg" alt="Ninth slide" height="200px" width="200px">
</div>
</div>
</div>
</div>
<a class="carousel-control-prev" href="#genreCarousel" role="button" data-
slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#genreCarousel" role="button" data-
slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
</div>
</section>

<section class="about-us">
<div class="container">
<h2 style="color: white;">About Us</h2>
<p style="color: white;">
Welcome to StreamBuzz Website, where we're dedicated to delivering the latest
news, reviews, and trailers from the world of cinema. Our mission is to build a vibrant
community of movie enthusiasts who share their passion for films. With engaging content and
interactive features, we aim to create an immersive movie experience for our audience. Join us
as we explore the magic of cinema together!
</p>
</div>
</section>

<footer>
<div class="container">
<p>&copy; 2024 StreamBuzz Website. All rights reserved.</p>
<!-- Social media icons go here -->
</div>
</footer>
<script src="https://code.jquery.com/jquery-3.5.1.slim.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></
script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
<script src="script.js"></script>
</body>
</html>
MOVIES CODE
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Movies - StreamBuzz</title>
<link rel="stylesheet" href="styles.css">
</head>
<style>
/* Global Styles */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}

header {
background-color: #333;
color: white;
padding: 20px 0;
}

nav ul {
list-style-type: none;
padding: 0;
}

nav ul li {
display: inline;
margin-right: 20px;
}

nav ul li a {
color: white;
text-decoration: none;
}

.movies {
background-color: #f4f4f4;
padding: 50px 0;
}

.movies h2 {
margin-bottom: 20px;
}

.movie-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.movie {
width: calc(33.33% - 20px);
margin-bottom: 40px;
padding: 20px;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.movie img {
width: 100%;
border-radius: 5px;
margin-bottom: 20px;
}

.movie h3 {
margin-bottom: 10px;
}

.movie p {
margin-bottom: 20px;
}

footer {
background-color: #333;
color: white;
padding: 20px 0;
text-align: center;
}

</style>
<body>
<header>
<div class="container">
<h1>StreamBuzz</h1>
<nav>
<ul>
<li><a href="test.html">Home</a></li>
<li><a href="movies.html">Movies</a></li>
<li><a href="genres.html">Genres</a></li>
<li><a href="about us.html">About Us</a></li>
<li><a href="contact us.html">Contact Us</a></li>
</ul>
</nav>
</div>
</header>

<section class="movies">
<div class="container">
<h2>Movies</h2>
<div class="movie-list">
<div class="movie">
<img
src="https://www.themoviedb.org/t/p/original/4sZccyDPEAlzdkGIfe20WHPQx9F.jpg" alt="Movie
1">
<h3>Movie Title 1</h3>
<p>Year: 2022</p>
</div>
<div class="movie">
<img src="https://ibomma.kalpanikfilms.com/wp-content/uploads/2023/05/Bio-
Ukushi-Featured-Image-Thumbnail.jpg" alt="Movie 2">
<h3>Movie Title 2</h3>
<p>Year: 2023</p>
</div>
<!-- Add more movies as needed -->
</div>
</div>
</section>
<section class="movies">
<div class="container">
<h2>Movies</h2>
<div class="movie-list">
<div class="movie">
<img src="https://wallpapercave.com/wp/wp1851909.jpg" alt="Movie 1">
<h3>Movie Title 1</h3>
<p>Year: 2022</p>
</div>
<div class="movie">
<img src="https://imageory.clapnumber.com/albums/large/1586864868.b5.jpg"
alt="Movie 2">
<h3>Movie Title 2</h3>
<p>Year: 2023</p>
</div>
<!-- Add more movies as needed -->
</div>
</div>
</section>
<section class="movies">
<div class="container">
<h2>Movies</h2>
<div class="movie-list">
<div class="movie">
<img src="https://th.bing.com/th/id/OIP.IbiyzwoE6REISLiPVDVi2gAAAA?
rs=1&pid=ImgDetMain" alt="Movie 1">
<h3>Movie Title 1</h3>
<p>Year: 2022</p>
</div>
<div class="movie">
<img src="https://th.bing.com/th/id/OIP.MqyBzDxHB1LTVRSfLi-0jAHaJQ?
rs=1&pid=ImgDetMain" alt="Movie 2">
<h3>Movie Title 2</h3>
<p>Year: 2023</p>
</div>
<!-- Add more movies as needed -->
</div>
</div>
</section>

<footer>
<div class="container">
<p>&copy; 2024 StreamBuzz Website. All rights reserved.</p>
</div>
</footer>
</body>
</html>
GENRES CODE
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Genres - StreamBuzz</title>

</head>
<style>
/* Global Styles */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}

header {
background-color: #333;
color: white;
padding: 20px 0;
}

nav ul {
list-style-type: none;
padding: 0;
}

nav ul li {
display: inline;
margin-right: 20px;
}

nav ul li a {
color: white;
text-decoration: none;
}

.genres {
background-color: #f4f4f4;
padding: 50px 0;
}

.genres h2 {
margin-bottom: 20px;
}

.genre-list {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}

.genre {
width: calc(33.33% - 20px);
margin-bottom: 40px;
padding: 20px;
background-color: white;
border-radius: 5px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

.genre img {
width: 100%;
border-radius: 5px;
margin-bottom: 20px;
}

.genre h3 {
margin-bottom: 10px;
}

.genre p {
margin-bottom: 20px;
}

.genre a {
display: inline-block;
background-color: #ff6f61;
color: white;
padding: 10px 20px;
text-decoration: none;
border-radius: 5px;
}

.genre a:hover {
background-color: #e04b3f;
}

footer {
background-color: #333;
color: white;
padding: 20px 0;
text-align: center;
}

</style>
<body>
<header>
<div class="container">
<h1>StreamBuzz</h1>
<nav>
<ul>
<li><a href="test.html">Home</a></li>
<li><a href="movies.html">Movies</a></li>
<li><a href="genres.html">Genres</a></li>
<li><a href="about us.html">About Us</a></li>
<li><a href="contact us.html">Contact Us</a></li>
</ul>
</nav>
</div>
</header>

<section class="genres">
<div class="container">
<h2>Genres</h2>
<div class="genre-list">
<div class="genre">
<img src="https://ibomma.kalpanikfilms.com/wp-content/uploads/2023/05/Bio-
Ukushi-Featured-Image-Thumbnail.jpg" alt="Action Genre">
<h3>Action</h3>
<p>Explore adrenaline-pumping action-packed movies.</p>
<a href="#">View Movies</a>
</div>
<div class="genre">
<img
src="https://www.themoviedb.org/t/p/original/4sZccyDPEAlzdkGIfe20WHPQx9F.jpg"
alt="Comedy Genre">
<h3>Comedy</h3>
<p>Laugh out loud with hilarious comedy films.</p>
<a href="#">View Movies</a>
</div>
<!-- Add more genres as needed -->
</div>
</div>
</section>

<footer>
<div class="container">
<p>&copy; 2024 StreamBuzz Website. All rights reserved.</p>
</div>
</footer>
</body>
</html>
ABOUT US
<!DOCTYPE html>
<html lang="en" ng-app="aboutApp">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>About Us</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
}

h1 {
text-align: center;
}

.container {
max-width: 600px;
margin: 0 auto;
}

p{
line-height: 1.6;
}
</style>
</head>
<body>
<div ng-controller="AboutController as vm" class="container">
<h1>About Us</h1>
<section class="about-us">
<div class="container">
<h2>About StreamBuzz</h2>
<p>Welcome to StreamBuzz, your ultimate destination for all things movies and
streaming!</p>

<h3>Our Mission</h3>
<p>Our mission at StreamBuzz is simple: to provide you with seamless access to a vast
library of movies, TV shows, and original content, all at your fingertips. We strive to deliver an
immersive streaming experience that transcends boundaries and connects audiences worldwide
through the power of storytelling.</p>

<h3>What We Offer</h3>
<ul>
<li><strong>Extensive Library:</strong> Explore a diverse range of genres, including
action, comedy, drama, sci-fi, and more. With thousands of titles available for streaming, there's
something for everyone to enjoy.</li>
<li><strong>Personalized Recommendations:</strong> Discover new favorites tailored
to your unique tastes and preferences. Our advanced recommendation algorithms analyze your
viewing history to suggest content you're likely to love.</li>
<li><strong>High-Quality Streaming:</strong> Enjoy crisp, high-definition streaming on
any device, anytime, anywhere. Whether you're watching on your TV, laptop, tablet, or
smartphone, our platform ensures a seamless viewing experience.</li>
<li><strong>Exclusive Originals:</strong> Immerse yourself in our exclusive lineup of
original series, documentaries, and films produced in collaboration with top creators and
filmmakers. From gripping dramas to laugh-out-loud comedies, our originals showcase diverse
voices and perspectives from around the globe.</li>
</ul>

<h3>Join the StreamBuzz Community</h3>


<p>Join our vibrant community of movie enthusiasts, where you can engage in
discussions, share recommendations, and connect with fellow fans. Follow us on social media
for the latest updates, behind-the-scenes content, and exclusive giveaways.</p>

<h3>Contact Us</h3>
<p>Have questions, feedback, or suggestions? We'd love to hear from you! Get in touch
with our dedicated support team via email, phone, or social media channels. Your feedback
helps us continually improve and enhance your streaming experience.</p>
<h3>Start Streaming Today</h3>
<p>Ready to embark on your cinematic journey? Sign up for StreamBuzz today and
unlock a world of entertainment at your fingertips. Whether you're craving blockbuster hits, indie
darlings, or cult classics, StreamBuzz has everything you need to satisfy your movie
cravings.</p>

<p>Experience the magic of movies like never before with StreamBuzz. Lights, camera,
action – let the streaming begin!</p>
</div>
</section>

</div>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
<script>
angular.module('aboutApp', [])
.controller('AboutController', function() {
var vm = this;
vm.aboutText = "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed non diam nec
enim tincidunt eleifend id eget ex. Integer nec urna a libero fermentum sodales. Vestibulum ante
ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Sed vestibulum ultrices
velit, eget congue enim. Nam auctor risus eget velit fermentum varius. Nam tincidunt suscipit
enim vel lacinia. Nullam efficitur augue id consectetur convallis. Aliquam erat volutpat. Donec
consequat gravida justo, nec faucibus velit gravida nec. In hac habitasse platea dictumst. Proin
volutpat risus at arcu feugiat consequat. Integer viverra, nunc sit amet sollicitudin tempor, ligula
velit finibus purus, vel fermentum tortor eros sit amet sapien. Vestibulum consequat, velit sit
amet rutrum tempus, ex mauris faucibus tellus, vitae vehicula lorem magna in ex.";
});
</script>
</body>
</html>
CONTACT US
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Contact Us - StreamBuzz</title>
<link rel="stylesheet" href="styles.css">
</head>
<style>
/* Global Styles */
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
}

.container {
max-width: 1200px;
margin: 0 auto;
padding: 0 20px;
}

header {
background-color: #333;
color: white;
padding: 20px 0;
}

nav ul {
list-style-type: none;
padding: 0;
}

nav ul li {
display: inline;
margin-right: 20px;
}

nav ul li a {
color: white;
text-decoration: none;
}

.contact-us {
background-color: #f4f4f4;
padding: 50px 0;
}

.contact-us h2 {
margin-bottom: 20px;
}

.contact-us p {
margin-bottom: 30px;
}

.contact-us form {
max-width: 500px;
margin: 0 auto;
}

.contact-us form label {


display: block;
margin-bottom: 10px;
}

.contact-us form input,


.contact-us form textarea {
width: 100%;
padding: 10px;
margin-bottom: 20px;
border: 1px solid #ccc;
border-radius: 5px;
}

.contact-us form button {


background-color: #ff6f61;
color: white;
padding: 10px 20px;
border: none;
border-radius: 5px;
cursor: pointer;
transition: background-color 0.3s;
}

.contact-us form button:hover {


background-color: #e04b3f;
}

footer {
background-color: #333;
color: white;
padding: 20px 0;
text-align: center;
}

</style>
<body>
<header>
<div class="container">
<h1>StreamBuzz</h1>
<nav>
<ul>
<li><a href="test.html">Home</a></li>
<li><a href="movies.html">Movies</a></li>
<li><a href="genres.html">Genres</a></li>
<li><a href="about us.html">About Us</a></li>
<li><a href="contact us.html">Contact Us</a></li>
</ul>
</nav>
</div>
</header>
<section class="contact-us">
<div class="container">
<h2>Contact Us</h2>
<p>Have questions, feedback, or suggestions? We'd love to hear from you! Fill out the
form below to get in touch with our dedicated support team.</p>
<form action="#" method="POST">
<label for="name">Name</label>
<input type="text" id="name" name="name" required>

<label for="email">Email</label>
<input type="email" id="email" name="email" required>

<label for="message">Message</label>
<textarea id="message" name="message" rows="5" required></textarea>

<button type="submit">Send Message</button>


</form>
</div>
</section>

<footer>
<div class="container">
<p>&copy; 2024 StreamBuzz Website. All rights reserved.</p>
</div>
</footer>
</body>
</html>

You might also like