Les sélecteurs peuvent être combinés pour être plus précis dans l'attribution d'un style.
- Sélecteur universel : *
Cela permet d'appliquer un style à toute la page ou bien d'initialiser la page html.
Exemple :
Je veux appliquer à toute la page une police comics sans ms
Dans mon fichier index.html :
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<h1>Grand Titre</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus in vestibulum dui. Cras ac cursus arcu. Donec sit amet erat vel odio pulvinar lacinia bibendum in turpis. Proin rhoncus tellus in tellus tincidunt laoreet. Cras sed scelerisque nibh. Quisque odio turpis, fermentum et lectus blandit, gravida ultricies neque. Donec eget lectus sodales, vestibulum erat id, venenatis odio. Mauris est libero, dignissim quis dui eu, hendrerit vulputate sem. Duis hendrerit dictum porta. Aenean tempor odio sedimperdiet interdum.
</p>
<table border="1">
<tr>
<th>achat</th>
</tr>
<tr>
<td>3 cahiers</td>
</tr>
tr>
<td>1 stylo</td>
</tr>
<tr>
<td>litière chat</td>
</tr>
</table>
</body>
</html>
<head>
<link rel="stylesheet" type="text/css" href="style.css"/>
</head>
<body>
<h1>Grand Titre</h1>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus in vestibulum dui. Cras ac cursus arcu. Donec sit amet erat vel odio pulvinar lacinia bibendum in turpis. Proin rhoncus tellus in tellus tincidunt laoreet. Cras sed scelerisque nibh. Quisque odio turpis, fermentum et lectus blandit, gravida ultricies neque. Donec eget lectus sodales, vestibulum erat id, venenatis odio. Mauris est libero, dignissim quis dui eu, hendrerit vulputate sem. Duis hendrerit dictum porta. Aenean tempor odio sedimperdiet interdum.
</p>
<table border="1">
<tr>
<th>achat</th>
</tr>
<tr>
<td>3 cahiers</td>
</tr>
tr>
<td>1 stylo</td>
</tr>
<tr>
<td>litière chat</td>
</tr>
</table>
</body>
</html>
Dans mon fichier style.css :
*{
font-family: comic sans ms;
}
font-family: comic sans ms;
}
Resultat :
cliquez sur l'image pour le voir en grand
On a la possibilité de mettre du css directement à l'intérieur d'une balise html : <table border="1"> bordure autour de mon tableau et apparition des cellules du tableau.NB : Le texte se trouvant dans le paragraphe c'est du faux texte du Lorem Ipsum que vous pouvez trouver sur internet afin de faire des tests sur votre page web.
Aucun commentaire:
Enregistrer un commentaire