-
Notifications
You must be signed in to change notification settings - Fork 31
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #21 from Gayathri-Jayan/main
flowers
- Loading branch information
Showing
1 changed file
with
100 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,100 @@ | ||
| <!DOCTYPE html> | ||
| <html lang="en"> | ||
| <head> | ||
| <meta charset="UTF-8"> | ||
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | ||
| <title>All About Flowers</title> | ||
| <style> | ||
| body { | ||
| font-family: 'Arial', sans-serif; | ||
| margin: 0; | ||
| padding: 0; | ||
| background-color: #f0f8ff; | ||
| } | ||
| header { | ||
| background-color: #ff7f50; | ||
| color: white; | ||
| text-align: center; | ||
| padding: 20px; | ||
| } | ||
| nav { | ||
| background-color: #ffa07a; | ||
| text-align: center; | ||
| padding: 10px; | ||
| } | ||
| nav a { | ||
| color: white; | ||
| text-decoration: none; | ||
| margin: 0 15px; | ||
| font-weight: bold; | ||
| } | ||
| section { | ||
| padding: 20px; | ||
| margin: 20px; | ||
| background-color: white; | ||
| border-radius: 8px; | ||
| box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); | ||
| } | ||
| .image-container img { | ||
| width: 100%; | ||
| height: auto; | ||
| border-radius: 8px; | ||
| } | ||
| footer { | ||
| text-align: center; | ||
| padding: 15px; | ||
| background-color: #ff7f50; | ||
| color: white; | ||
| position: relative; | ||
| bottom: 0; | ||
| width: 100%; | ||
| } | ||
| h2 { | ||
| color: #333; | ||
| } | ||
| p { | ||
| color: #555; | ||
| line-height: 1.6; | ||
| } | ||
| </style> | ||
| </head> | ||
| <body> | ||
| <header> | ||
| <h1>All About Flowers</h1> | ||
| </header> | ||
|
|
||
| <nav> | ||
| <a href="#roses">Roses</a> | ||
| <a href="#sunflowers">Sunflowers</a> | ||
| <a href="#tulips">Tulips</a> | ||
| </nav> | ||
|
|
||
| <section id="roses"> | ||
| <h2>Roses</h2> | ||
| <div class="image-container"> | ||
| <img src="https://example.com/rose.jpg" alt="Roses"> | ||
| </div> | ||
| <p>Roses are one of the most popular flowers in the world. They are known for their beauty and are often associated with love and romance. Roses come in many different colors, each having its unique meaning.</p> | ||
| </section> | ||
|
|
||
| <section id="sunflowers"> | ||
| <h2>Sunflowers</h2> | ||
| <div class="image-container"> | ||
| <img src="https://example.com/sunflower.jpg" alt="Sunflowers"> | ||
| </div> | ||
| <p>Sunflowers are tall, bright flowers known for their large yellow petals and seeds. They are often associated with happiness and positivity and are known to follow the sun's movement, a phenomenon called heliotropism.</p> | ||
| </section> | ||
|
|
||
| <section id="tulips"> | ||
| <h2>Tulips</h2> | ||
| <div class="image-container"> | ||
| <img src="https://example.com/tulip.jpg" alt="Tulips"> | ||
| </div> | ||
| <p>Tulips are spring-blooming flowers that come in a variety of vibrant colors. They symbolize renewal and the arrival of spring, making them a favorite for gardens and bouquets alike.</p> | ||
| </section> | ||
|
|
||
| <footer> | ||
| <p>© 2024 Flower Lovers</p> | ||
| </footer> | ||
| </body> | ||
| </html> |