Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fixed first section as well as few others #48

Merged
merged 1 commit into from
Oct 4, 2021
Merged

fixed first section as well as few others #48

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
330 changes: 173 additions & 157 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,19 +2,20 @@
<html lang="en">

<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="assets/mytree.jpg">
<link rel="stylesheet" href="style.css">
<title>MYTrees</title>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="assets/mytree.jpg">
<link rel="stylesheet" href="style.css">
<title>MYTrees</title>



<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">

<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">


</head>
Expand All @@ -23,158 +24,173 @@



<div class="navbar">

<div class="title">
<span id="logo">
<img src="assets/mytree.jpg" height="64px" width="64px">
</span>MY TREE</div>
<div class="navbar-right">
<a href="/home.html">Home</a>
<a href="./pages/contact/index.html">Contact Us</a>
<a href="./pages/about/index.html">About Us</a>

</div>
</div>
<hr>
<header>
<center><h1>MY TREES</h1></center>
</header>


<div class="container justify-content-center">

<div class="row">
<img
src="https://images.pexels.com/photos/1632790/pexels-photo-1632790.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500">
</div>
<div class="col">
<p>A banyan, also spelled "banian", is a fig that begins its life as an epiphyte, i.e. a plant that grows on
another plant, when its seed germinates in a crack or crevice of a host tree or edifice.</p>
</div>
</div>
<div class="container justify-content-center">

<div class="row">
<img src="assets/pride_of_india.jpg">
</div>
<div class="col d-flex flex-column">
<h5>Name:<h5>
<h6>Pride of India
</h5>
<h5>Scientific Name:<h5>
<h6>Lagerstroemia speciosa
</h5>
<ul>
<li>
<p>A large tree blooms in hot summer with pink flowers.</p>
</li>
<li>
<p>A postal stamp was issued by the Indian Postal Department to commemorate this flower</p>
</li>
</ul>


</div>
</div>

<hr>
<div class="container justify-content-center">

<div class="row">
<img src="assets/umbrella.jpg" height="500px" width="300px" style="border-radius: 30px;">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h5>Name: Umbrella Tree</h5>
<br>
<h5>Scientific Name: Schefflera arboricola</h5>
<br>
<h5>Description: The umbrella plant is a multi trunk tree that can grows over 15 metres tall outdoors and has to be pruned and topped at some point to keep its size manageable within a home. Its close relative (Schefflera Actinophylla) has to carefully planted because of its invasive nature and is seen as a weed in certain places. <h5>

</div>
</div>

<hr>
<div class="container justify-content-center">

<div class="row">
<img src="assets/mango.jpg" height="500px" width="300px" style="border-radius: 30px;">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h5>Name: Mango Tree<h5>
<h5>Scientific Name:Mangifera indica<h5>
<h5>Description:Mangifera indica, commonly known as mango, is a species of flowering plant in the sumac and poison ivy family Anacardiaceae. Mangoes are believed to have originated from the region between northwestern Myanmar, Bangladesh, and India. <h5>

</div>
</div>

<hr>
<div class="container justify-content-center">

<div class="row">
<img src="assets/ebony.jpg" height="500px" width="300px" style="border-radius: 30px;">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h3><b>Name :</b> Makassar Ebony Tree</h3>
<h4><b>Scientific Name :</b> Diospyros celibica</h4>
<h5><b>Description :</b> Diospyros celebica (commonly known as black ebony, or Makassar ebony) is a species of flowering tree in the family Ebenaceae that is endemic to the island of Sulawesi in Indonesia.
The common name Makassar ebony is for the main seaport on the island, Makassar.
Makassar ebony wood is variegated, streaky brown and black, and nearly always wide-striped.
It is considered a highly valuable wood for turnery, fine cabinet work, and joinery, and is much sought for posts in traditional Japanese houses.
</h5>
</div>
</div>
<hr>

<div class="container justify-content-center">

<div class="row">
<img src="https://image.shutterstock.com/image-vector/illustration-tall-ashoka-tree-on-600w-226525891.jpg" height="500px" width="300px" style=" margin-left:50px ; border-radius: 30px">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px; margin: 0 200px 200px 200px;">
<br><br><br><br><br>
<h5><u>ASHOKA VRIKSHA</u><h5>
<h5>Scientifically known as SARACA ASOCA<h5>
<h5>Ashok is one of the most legendary and sacred trees of India. The Scientific name of Sita Ashok is Saraca asoca, and it belongs to Leguminosae family. This tree is native to Indian subcontinent & it is found growing naturally in the Western Ghats and the Eastern Himalayas.</h5>

</div>
</div>
<section class="elder">
<div class="information">
<h5>Name:</h5><h6>Elder tree</h6>
<h5>Scientific name</h5><h6><em>Sambucus nigra</em></h6>
<h5>Details</h5>
<ul>
<li>Mature elder trees grow to a height of around 15m and can live for 60 years.</li>
<li>Elder is characterised by its short trunk (bole), and grey-brown, corky, furrowed bark. It has relatively few branches.</li>
<li>It was thought that if you burned elder wood you would see the Devil, but if you planted elder by your house it would keep the Devil away.</li>
</ul>
</div>
<div>
<figure>
<img src="./assets/elder.jpeg" alt="A picture of an elder tree in a field, surrounded by wildlife">
<br>
<figcaption>A picture of Elder tree</figcaption>
</figure>
</div>

</section>

<hr>

<div class="navbar">

<div class="title">
<span id="logo">
<img src="assets/mytree.jpg" height="64px" width="64px">
</span>MY TREE
</div>
<div class="navbar-right">
<a href="/home.html">Home</a>
<a href="./pages/contact/index.html">Contact Us</a>
<a href="./pages/about/index.html">About Us</a>

</div>
</div>
<hr>
<header>
<center>
<img class="tree" src="https://media4.giphy.com/media/3oxHQF2ikoMMGkiKwo/giphy.gif?cid=790b76117b04266be2239745f22710d79b2fe784eec65401&rid=giphy.gif&ct=g" alt=tree-gif >
<h1>MY TREES</h1>
</center>
<img src="tree.png" alt="">
</header>
<div class="container justify-content-center">
<div class="row">
<img src="https://images.pexels.com/photos/1632790/pexels-photo-1632790.jpeg" height="500px" width="300px"
style="border-radius: 30px;" alt="Image of Banyan tree">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h5><strong>Name:</strong> Banyan</h5>
<br>
<h5><strong>Description:</strong> A banyan, also spelled "banian", is a fig that begins its life as an epiphyte,
i.e. a plant that
grows on another plant, when its seed germinates in a crack or crevice of a host tree or edifice.<h5>
</div>
</div>
<hr>
<div class="container justify-content-center">
<div class="row">
<img src="assets/pride_of_india.jpg" height="500px" width="300px" style="border-radius: 30px;"
alt="Picture of Pride of India tree">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h5><strong>Name:</strong> Pride of India</h5>
<br>
<h5><strong>Scientific Name:</strong> Lagerstroemia speciosa</h5>
<br>
<h5><strong>Description:</strong> Large tree blooms in hot summer with pink flowers. A postal stamp was issued by
the Indian Postal
Department to commemorate this flower<h5>
</div>
</div>
<hr>
<div class="container justify-content-center">

<div class="row">
<img src="assets/umbrella.jpg" height="500px" width="300px" style="border-radius: 30px;">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h5><strong>Name:</strong> Umbrella Tree</h5>
<br>
<h5><strong>Scientific Name:</strong> Schefflera arboricola</h5>
<br>
<h5><strong>Description:</strong> The umbrella plant is a multi trunk tree that can grows over 15 metres tall
outdoors and has to
be pruned and topped at some point to keep its size manageable within a home. Its close relative (Schefflera
Actinophylla) has to carefully planted because of its invasive nature and is seen as a weed in certain places.
<h5>

</div>
</div>

<hr>
<div class="container justify-content-center">

<div class="row">
<img src="assets/mango.jpg" height="500px" width="300px" style="border-radius: 30px;">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h5><strong>Name:</strong> Mango Tree<h5>
<h5><strong>Scientific Name:</strong> Mangifera indica<h5>
<h5><strong>Description:</strong> Mangifera indica, commonly known as mango, is a species of flowering
plant in the sumac
and poison ivy family Anacardiaceae. Mangoes are believed to have originated from the region between
northwestern Myanmar, Bangladesh, and India. <h5>

</div>
</div>

<hr>
<div class="container justify-content-center">

<div class="row">
<img src="assets/ebony.jpg" height="500px" width="300px" style="border-radius: 30px;">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px;">
<br><br><br><br><br>
<h3><b>Name :</b> Makassar Ebony Tree</h3>
<h4><b>Scientific Name :</b> Diospyros celibica</h4>
<h5><b>Description :</b> Diospyros celebica (commonly known as black ebony, or Makassar ebony) is a species of
flowering tree in the family Ebenaceae that is endemic to the island of Sulawesi in Indonesia.
The common name Makassar ebony is for the main seaport on the island, Makassar.
Makassar ebony wood is variegated, streaky brown and black, and nearly always wide-striped.
It is considered a highly valuable wood for turnery, fine cabinet work, and joinery, and is much sought for
posts in traditional Japanese houses.
</h5>
</div>
</div>
<hr>

<div class="container justify-content-center">

<div class="row">
<img src="https://image.shutterstock.com/image-vector/illustration-tall-ashoka-tree-on-600w-226525891.jpg"
height="500px" width="300px" style=" margin-left:50px ; border-radius: 30px">
</div>
<div class="col d-flex flex-column" style="padding-left: 50px; margin: 0 200px 200px 200px;">
<br><br><br><br><br>
<h5><u>ASHOKA VRIKSHA</u>
<h5>
<h5>Scientifically known as SARACA ASOCA<h5>
<h5>Ashok is one of the most legendary and sacred trees of India. The Scientific name of Sita Ashok is
Saraca asoca, and it belongs to Leguminosae family. This tree is native to Indian subcontinent & it is
found growing naturally in the Western Ghats and the Eastern Himalayas.</h5>

</div>
</div>
<section class="elder">
<div class="information">
<h5>Name:</h5>
<h6>Elder tree</h6>
<h5>Scientific name</h5>
<h6><em>Sambucus nigra</em></h6>
<h5>Details</h5>
<ul>
<li>Mature elder trees grow to a height of around 15m and can live for 60 years.</li>
<li>Elder is characterised by its short trunk (bole), and grey-brown, corky, furrowed bark. It has relatively
few branches.</li>
<li>It was thought that if you burned elder wood you would see the Devil, but if you planted elder by your house
it would keep the Devil away.</li>
</ul>
</div>
<div>
<figure>
<img src="./assets/elder.jpeg" alt="A picture of an elder tree in a field, surrounded by wildlife">
<br>
<figcaption>A picture of Elder tree</figcaption>
</figure>
</div>

</section>

<hr>

<center>
<img class="tree"
src="https://media4.giphy.com/media/3oxHQF2ikoMMGkiKwo/giphy.gif?cid=790b76117b04266be2239745f22710d79b2fe784eec65401&rid=giphy.gif&ct=g"
alt=tree-gif>
</center>
<img src="tree.png" alt="">



<div class="footer">
<p> Made with <span> &#128151</span> to love trees</p>
<p> Made with <span> &#128151</span> to love trees</p>
</div>

</body>

</html>
</html>
7 changes: 5 additions & 2 deletions style.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,13 +2,16 @@

h1 {
color: #32502e;
font-family: sans-serif;
font-family: 'Oleo Script', sans-serif;
font-weight: 700;
}

body {
background-color: wheat;
}

center {
margin-bottom: 40px;
}
.container {
margin: 10px;
display: flex;
Expand Down