Un site html sur les chats par Ekaterina

Création d’un site html sur les chat accompagné d’une feuille de style (css)

Article mis en ligne le 29 janvier 2016

dernière modification le 3 février 2016

Voici son site :

http://tableauxmaths.fr/productions_eleves/site_chats_ekaterina/leschatons.html

Voici les codes html et css :

Le html :

<!DOCTYPE html>
<html> 
		<head>
			 <meta charset='utf-8'  />
		<link rel="stylesheet" href="style.css"/>
			 <title>Les chatons</title>
		</head>
<body>

<div class="gris">
<a href="#haut">Haut de page</a>
</div>

<FONT color="black"><center><h1>Les chatons</h1></center></FONT color="black">

<FONT color="black"><br>
<p><big>
Le chat domestique (Felis silvestris catus) est la sous-espèce issue de la domestication du chat sauvage, mammifère carnivore de la famille des félidés. Il est l’un 
des principaux animaux de compagnie et compte aujourd’hui une cinquantaine de races différentes reconnues par les instances de certification. Dans de nombreux pays, 
le chat entre dans le cadre de la législation sur les carnivores domestiques à l’instar du chien et du furet.<br/>

<br>Essentiellement territorial, le chat est un prédateur de petites proies comme les rongeurs ou les oiseaux. Les chats ont diverses vocalisations dont les ronronnements, 
les miaulements, les feulements ou les grognements, bien qu’ils communiquent principalement par des positions faciales et corporelles et des phéromones. Selon les 
résultats de travaux menés en 2006 et 20071, le chat domestique est une sous-espèce du chat sauvage (Felis silvestris) issu d'ancètres appartenant à la sous-espèce du 
chat sauvage d’Afrique (Felis silvestris lybica). Les premières domestications auraient eu lieu il y a 8 000 à 10 000 ans au Néolithique dans le Croissant fertile, époque
 correspondant au début de la culture de céréales et à l’engrangement de réserves susceptibles d’être attaquées par des rongeurs, le chat devenant alors pour l’homme un 
 auxiliaire utile se prêtant à la domestication.<br/>

<br>Tout d’abord vénéré par les Égyptiens, il fut diabolisé en Europe au Moyen Âge et ne retrouva ses lettres de noblesse qu’au XVIIIe siècle. En Asie, le chat reste synonyme
 de chance, de richesse ou de longévité. Ce félin a laissé son empreinte dans la culture populaire et artistique, tant au travers d’expressions populaires que de
 représentations diverses au sein de la littérature, de la peinture ou encore de la musique.</big></p></h1><br></FONT color="black">
 
 <br><center><iframe width="420" height="315" src="https://www.youtube.com/embed/HPIWXIY2tRE" frameborder="0" allowfullscreen></iframe></center>


 <table>
 <center>
   <tr>
   <FONT color=red>
       <td><big> <FONT color="#FF358B">_____Persan_____</big></td> 
	   
	   <td><img class="mesimages" src="image/persan.jpg"/></td>
       
	   <td><big> <FONT color="#FF358B"> _____Origine de l'iran_____</big></td>
       
	   <td><big> <FONT color="#FF358B">_____ 2.3 à 6.8 kg_____</big></td>
   </tr>
<tr>
       <td><big> <FONT color="#FF358B"> _____Munchkin_____</big></td>
       
	   <td><img class="mesimages" src="image/munchkin.jpg"/></td>
	   
	   <td><big><FONT color="#FF358B">_____Origine des états-unis_____</big></td>
       
	   <td><big><FONT color="#FF358B">_____ 2 à 6 kg_____</big></td>
   
   </tr><tr>
       <td><big><FONT color="#FF358B">_____ Ragdoll_____</big></td>
       
	   <td><img class="mesimages" src="image/ragdoll.jpg"/></td>
	   
	   <td><big><FONT color="#FF358B">_____ Origine americaine_____</big></td>
       
	   <td><big><FONT color="#FF358B">_____ 6 à 9 kg_____</big></td>
   </tr>
</table>

<div class="gris">
<a href="#haut">bas de page</a>
</div>
</body>
</html>

Le css :

body {
	color:black;
	background-color:white;
	background-image:url("image/coeur.jpg");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
}
table
{
    border-collapse: collapse; /* Les bordures du tableau seront
collées  */
	margin: auto;
}
td
{
text-align :center;
}

td
{
    border: 1px solid black;
}

.gris {
background-color:#222;
width:100px;
}
.mesimages {
height:300px;
width:300px;
}
p
{
	border:5px #FF358B dashed;
}