Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- <!DOCTYPE html>
- <html>
- <head>
- <style>
- head {
- padding-top: 0;
- margin-top: 0;
- border: none;
- }
- header {
- width: 100%;
- height: 15%;
- padding-bottom: 20px;
- background-color: navy;
- align-content: center;
- align-items: center;
- border-bottom: pink 5px solid;
- }
- #image1 {
- display: block;
- margin-left: auto;
- margin-right: auto;
- height: 10vh;
- width: 10vh;
- }
- nav {
- height: 78vh;
- width: 30%;
- background-color: navy;
- color: white;
- float: left;
- margin-right: 50px;
- }
- nav {
- width: 30%;
- color: white;
- }
- ul {
- list-style-type: none;
- margin: 0;
- padding: 0;
- text-align: center;
- }
- li{
- display:block;
- }
- li a {
- color: white;
- text-decoration: none;
- display: block;
- padding: 8px 8px;
- }
- li a:hover {
- background-color: purple;
- }
- #main-box {
- float: left;
- }
- #img1{
- width: 50vh;
- height: 20vh;
- border: pink 5px solid;
- }
- footer {
- float: left;
- height: 7.5vh;
- width: 100%;
- background-color: navy;
- color: white;
- border-top: 5px pink solid;
- padding-top: 20px;
- text-align: center;
- }
- </style>
- </head>
- <body>
- <body style="margin: 0;"></body>
- <header>
- <img src="images1.jpg" id="image1">
- </header>
- <nav>
- <ul>
- <li>
- <a href="">
- <h3>Home</h3>
- </a>
- </li>
- <li>
- <a href="">
- <h3>About</h3>
- </a>
- </li>
- <li>
- <a href="">
- <h3>Services</h3>
- </a>
- </li>
- <li>
- <a href="contact.html">
- <h3>Contact Us</h3>
- </a>
- </li>
- </ul>
- </nav>
- <div id="main-box">
- <h2>About Us</h2>
- <img src="images.jpg" id="img1">
- </div>
- <footer>
- <p>© 2018</p>
- </footer>
- </body>
- </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement