1
My HTML and CSS:
body {
background-image: url(img/fundonew.png);
background-repeat: repeat-x;
font-family: Arial;
background-color: #003013;
}
#main {
position: absolute;
top:0px;
left:50%;
width: 770px;
margin-left: -450px;
}
#logo {
position: absolute;
top:0px;
left: -100px;
width: 150px;
height: 150px;
}
#btinicio {
position: absolute;
top:60px;
left:340px;
width: auto;
height: 33px;
}
#btaquecimento {
position: absolute;
top:60px;
left:470px;
width: auto;
height: 33px;
}
#btefeito {
position: absolute;
top:60px;
left:670px;
width: auto;
height: 33px;
}
#btea {
position: absolute;
top:60px;
left:810px;
width: auto;
height: 33px;
}
#conteudo {
position: relative;
top:150px;
left:2px;
width:900px;
height: auto;
background-color: #bcc1ad;
color: #0024ff;
}
#conteudo p{
font-size:20px;
text-align: justify;
margin-left: 10px;
margin-right: 10px;
}
#footer {
position:absolute;
bottom: 0px;
width: 100%;
}
<!DOCTYPE html>
<html>
<head>
<title>Educãção Ambiental</title>
<link rel="stylesheet" type="text/css" href="style.css" media="screen" />
</head>
<body>
<div id="main">
<div id="logo">
<a href="index.html"><img src="img/logoofc.png" border="0"></a>
</div>
<div id="btinicio">
<a href="index.html"><img src="img/inicio1.png" border="0" onMouseOver="this.src='img/inicio2.png'" onMouseOut="this.src='img/inicio1.png'"></a>
</div>
<div id="btaquecimento">
<a href="aquecimento.html"><img src="img/aquecimento2.png" border="0" onMouseOver="this.src='img/aquecimento3.png'" onMouseOut="this.src='img/aquecimento2.png'"></a>
</div>
<div id="btefeito">
<a href="efeito.html"><img src="img/efeito1.png" border="0" onMouseOver="this.src='img/efeito2png.png'" onMouseOut="this.src='img/efeito1.png'"></a>
</div>
<div id="btea">
<a href="ea.html"><img src="img/ea2.png" border="0" onMouseOver="this.src='img/ea3.png'" onMouseOut="this.src='img/ea2.png'"></a>
</div>
<div id="conteudo">
<h2>
O planeta pede socorro
</h2>
<p>
Falta d'água. Falta de energia. Falta de área verde. Tudo isso gerado pela falta de consciência das pessoas.
<br>
<br>
Estamos começando a sentir o mal que a Terra sente há anos, o elevado uso dos recursos naturais do Planeta está sobrecarregando-o, ultrapassando o limite, e se não respeitado esse limite, o que poderá ocorrer futuramente ?
</p>
<p>
A reciclagem é uma de várias maneiras que podem ser colocada é prática para solucionar alguns problemas ambientais, é necessário que sempre tenhamos em mente que não devemos jogar lixo em qualquer lugar, um exemplo claro, é o lixo eletrônico.
<br>
<br>
Hoje milhares de pessoas tem celular, e por causa da rápida obsolescência desses equipamentos, é comum jogarmos eles nos lixos de casa ou da rua, porém, é um hábito errado, que pode trazer várias doenças e impactos ambientais, o certo seria levar para estabelecimentos que fazem esse tipo de reciclagem para que não ocorra esses casos.
<br>
<br>
A poluição do ar é preocupante , a emissão de CO2 aumenta a cada ano, entretanto, esse é um problema que só pode ser combatido em conjunto, ao invés de usar carros ou motos para sair, pode-se usar as bicicletas, pois além de fazer bem para a saúde, minimiza a emissão de dióxido de carbono na atmosfera.
<br>
<br>
Fica claro, portanto, que os nossos maus hábitos estão trazendo inúmeros problemas ambientais que só podem ser resolvidos em conjunto.
<br>
<br>
A mídia é um importante fator nesse cenário, pois ela precisa denunciar e esclarecer a sociedade sobre as nossas atitudes, mostrar os problemas que estamos gerando e o que poderá acontecer se não mudarmos os nossos hábitos.
<br>
<br>
O governo deve criar medidas que cesse a poluição e o consumo exagerado. E é necessário que cada indivíduo tenha consciência do que está acontecendo e respeite o meio ambiente, evitando desperdício e reduzindo embalagens, porque o "planeta pede socorro".
</p>
</div>
<div id="footer">
<h1>Desenvolvido pelo grupo: Shadow - Para a semana Paulo Freire</h1>
</div>
</div>
</body>
</html>
Oii good night, thank you so much for the help. I am beginner in the area, you saved me. I was almost giving up haha
– WCDS
Hahaha, don’t give up, partner! Take the bootstrap p/ make the layout life easier, then you don’t need to edit the css to edit the layout, just use the classes; just success. If you can send Thumbs up. Abs and good luck with your project
– Leonardo Negrão