-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
2f001f8
commit 25489bf
Showing
1 changed file
with
97 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,97 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>Birds Website</title> | ||
| <link rel="stylesheet" href="styles.css"> | ||
| <script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"></script> | ||
| </head> | ||
| <body> | ||
|
|
||
| <header> | ||
| <nav> | ||
| <div class="logo">Birds</div> | ||
| <ul class="nav-links"> | ||
| <li><a href="#Hero">Home</a></li> | ||
| <li><a href="#Bird Species">Bird Species</a></li> | ||
| </ul> | ||
| </nav> | ||
| </header> | ||
| <section class="hero" id="Hero"> | ||
| <div class="hero-content"> | ||
| <h1>Discover the World of <span class="underlined underline-clip">Birds</span></h1> | ||
| </div> | ||
| </section> | ||
| <section class="featured-birds"> | ||
| <div class="container"> | ||
| <h2>Featured Bird Species</h2> | ||
| <div class="bird-gallery"> | ||
| <div class="bird-card"> | ||
| <img src="https://www.wildlifeexplained.com/wp-content/uploads/2022/01/bald-eagle-960x720.jpg.webp" alt="Bird 1"> | ||
| <h3>Hawks</h3> | ||
| <p>Hawks, eagles, Old World vultures, and kites are all diurnal birds of prey belonging to the Accipitriformes order.</p> | ||
| </div> | ||
| <div class="bird-card"> | ||
| <img src="https://www.wildlifeexplained.com/wp-content/uploads/2023/01/blue-and-yellow-macaw-flying-960x694.jpg.webp" alt="Bird 2"> | ||
| <h3>Parrots</h3> | ||
| <p>This bird is classified as a parrot because it has a curved beak, and all parrots have zygodactyl feet.</p> | ||
| </div> | ||
| <!-- Add more bird cards as needed --> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| <section class="explore-bird-species" id="Bird Species"> | ||
| <div class="container"> | ||
| <h2>Explore Bird Species</h2> | ||
| <div class="bird-thumbnails"> | ||
| <div class="bird-thumbnail"> | ||
| <img src="https://images.squarespace-cdn.com/content/v1/55c0d7e5e4b05b835010c1f4/1585931741074-KXZL1OGK9WZW73K4SY2R/16885281018_328dc64eb2_k.jpg" alt="Bird 1"> | ||
| <h3>American Woodcock</h3> | ||
| </div> | ||
| <div class="bird-thumbnail"> | ||
| <img src="https://th.bing.com/th/id/OIP.Csz54RrFHooRjSa4aPF3iwHaE6?rs=1&pid=ImgDetMain" alt="Bird 2"> | ||
| <h3>Bonaparte's Gull</h3> | ||
| </div> | ||
| <div class="bird-thumbnail"> | ||
| <img src="https://th.bing.com/th/id/OIP.jWeKowikXkEJOLK2a-eZsAHaE7?rs=1&pid=ImgDetMain" alt="Bird 2"> | ||
| <h3>Glossy Ibis</h3> | ||
| </div> | ||
| <div class="bird-thumbnail"> | ||
| <img src="https://th.bing.com/th/id/OIP.P7_0N6Fy_5kAzkj1xb-NdwHaEo?rs=1&pid=ImgDetMain" alt="Bird 2"> | ||
| <h3>Hammond's Flycatcher</h3> | ||
| </div> | ||
| <!-- Add more bird thumbnails as needed --> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| <section class="blog"> | ||
| <div class="container"> | ||
| <h2>Blog</h2> | ||
| <div class="blog-posts"> | ||
| <div class="blog-post"> | ||
| <img src="bird1.jpg" alt="Blog Post 1"> | ||
| <h3>Blog Post Title 1</h3> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi.</p> | ||
| <a href="#" class="btn">Read More</a> | ||
| </div> | ||
| <div class="blog-post"> | ||
| <img src="bird2.jpg" alt="Blog Post 2"> | ||
| <h3>Blog Post Title 2</h3> | ||
| <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla facilisi.</p> | ||
| <a href="#" class="btn">Read More</a> | ||
| </div> | ||
| <!-- Add more blog posts as needed --> | ||
| </div> | ||
| </div> | ||
| </section> | ||
| <footer> | ||
| <div class="container"> | ||
| <div class="copyright"> | ||
| © 2024 Birds. All rights reserved. | ||
| </div> | ||
| </div> | ||
| </footer> | ||
|
|
||
| </body> | ||
| </html> |