CODECADEMY EXCURSION
How do I make an codecademy excursion?
What is a codecademy excursion? How do you make a codecademy excursion? This script and codes were developed by David Carranza on 09 October 2022, Sunday.
CODECADEMY EXCURSION - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>CODECADEMY EXCURSION</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <!-- WORKING ON CODEPEN BECAUSE ITS EASIER AND LIVE UPDATE -->
<html> <head> <link href='https://fonts.googleapis.com/css?family=Open+Sans:300' rel='stylesheet' type='text/css'> <link rel='stylesheet' href='style.css'/> </head> <body> <!-- Main section --> <div class="main"> <video autoplay muted loop> <source src="https://s3.amazonaws.com/codecademy-content/projects/excursion/bg.mp4" type="video/mp4"> </video> <div class="content container"> <h1>Discover hidden places in the world around you</h1> <a href='#' class='btn' >Download Excursion</a> </div> </div> <!-- First supporting section --> <div class="supporting"> <div class="container"> <h2>Your personal travel guide</h2> <p>Excursion remembers places you like, and recommends new points of interest around you.</p> </div> </div> <!-- Feature section --> <div class="feature"></div> <!-- Second supporting section --> <div class="supporting"> <div class="container"> <img src='https://s3.amazonaws.com/codecademy-content/projects/excursion/binoculars.png'/> <h2>Available for iPhone and Android</h2> <a href='#' class='btn'>Download Excursion</a> </div> </div> <!-- Footer --> <div class="footer"> <div class="container"> <p id='footerP'>© Excursion</p> </div> </div> </body>
</html>
</body>
</html>
CODECADEMY EXCURSION - Script Codes CSS Codes
* { box-sizing: border-box;
}
html, body { margin: 0; padding: 0; font-family: 'Open Sans', sans-serif; background-color: #fff;
}
.container { max-width: 940px; margin: 0 auto;
}
.main { position: relative; text-align: center;
}
.main video { width: 100%;
}
.main .content { position: absolute; top: 200px; width: 100%; left: 0; right: 0; margin: 0 auto;
}
.main h1 { font-size: 50px; text-shadow: 0 2px 3px rgba(0,0,0,.4); color: #FFF; padding-bottom: 30px;
} .btn { background-color:#4386FC; color: #fff; text-decoration: none; padding: 15px;
}
.supporting { margin-top: 100px; margin-bottom: 130px; background-color: #FFF; text-align: center;
}
.supporting h2 { font-size: 48px; font-weight: 300;
}
.supporting p { color: #333; font-size: 21px; font-weight: 300; padding: 0 30px;
}
.feature { height: 500px; background: url('https://s3.amazonaws.com/codecademy-content/projects/excursion/camp.png') no-repeat center center ; background-size: cover;
}
.footer { padding: 30px; background-color: #eeeeee;
}
#footerP { color: #000; font-size: 12px;
}
@media (max-width: 960px) { .main { height: 540px; } .main video { height: 540px; width: 960px; } .main h1 { font-size: 32px; }
}
Developer | David Carranza |
Username | HotChaiLatte |
Uploaded | October 09, 2022 |
Rating | 3 |
Size | 2,432 Kb |
Views | 30,360 |
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Name | Size |
Newsroom Codecademy project | 2,967 Kb |
Wikipedia Viewer | 2,619 Kb |
HEADLINES CODECADEMY PROJECT | 2,674 Kb |
Uematsu | 2,512 Kb |
Codecademy Bass Project | 2,924 Kb |
Codeacademy Meme Generator jQuery Project | 2,738 Kb |
A Pen by David Carranza | 1,539 Kb |
CODECADEMY BOLT | 3,159 Kb |
Twitch APP FREECODECAMP | 2,022 Kb |
React practice | 4,427 Kb |
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Name | Username | Size |
A Pen by James Podles | Jpod | 2,656 Kb |
Front in Aracaju Logo Pure CSS | Shankarcabus | 2,581 Kb |
Midterm dry run | Jds317 | 1,649 Kb |
Starting out with Ember.JS | Cfleschhut | 4,808 Kb |
Intake Form Page 2 | Ijantje | 4,983 Kb |
Heartbeat | Apetrov | 2,079 Kb |
Polygon Logo in CSS | Kai | 3,412 Kb |
A Pen by aleen42 | Aleen42 | 11,473 Kb |
Tab Menus | Zephyr | 3,180 Kb |
Confirm Close Of Foundation Reveal Modal | Winghouchan | 1,818 Kb |
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!