TP CSS

Nombre de messages : 39 Age : 38 Date d'inscription : 21/01/2007

TP CSS

Exemple 1 : CSS à l’intérieur d’une page HTML

<html>

<head>

<title>Titre</title>

<style type="text/css">

/* Première fuille de style */

h1{

font-size:30px;

color:blue;

}

t1{

font-style:italic;

font-size:20px;

color:red;

}

</style>

</head>

<body>

<h1>Premier texte</h1>

<t1>Premier titre</t1>

</body>

</html>

Exemple 2 : CSS dans un fichier séparé

- Fichier Style1.css

/* Première fuille de style */

h1{

font-size:30px;

color:blue;

}

t1{

font-style:italic;

font-size:20px;

color:red;

}

- Page HTML qui utilise le style précédent

<html>

<head>

<title>Titre</title>

<link href="style.css" rel="stylesheet" type="text/css">

</head>

<body>

<h1>Premier texte</h1>

<t1>Premier titre</t1>

</body>

</html>

3 – Exemple plus général

- Fichier Style2.css

A,H1,H2,H3,P { font-family: Verdana, Arial; font-weight: bold; }

A:hover { color: #000000 }

A { color: #0060A0; font-size: 10pt; }

H1 { color: #004080; text-align: center; }

H2 { color: #0060A0; text-align:left; font-size: 14pt; }

H3 { color: #0060A0; text-align:left; font-size: 13pt; }

P { color: #00A0FF; font-size: 10pt; text-align: justify; text-indent: 15pt;

}

DIV.note { text-size:1; text-align:center; }

TABLE.SectionCode {

background-color: #E0E0E0;

border-style:ridge; border-width:1pt; border-color:grey;

text-align:center; width:80%;

}

.SectionCode P,.SectionCode PRE {

text-align:left; font-size:medium;

font-family:courier; color:#000000;

}

- Page2.htm

<html>

<head>

<title>Titre</title>

<link href="style2.css" rel="stylesheet" type="text/css">

</head>

<body>

<h1>Style h1</h1>

<h2>Style h2</h2>

<h3> Style h3</h3>

<p>Paragraphe</p>

<a href="exemple1.htm">Lien</a>

<div class="note">

Texte

</div>

<table class="SectionCode">

<tr class="ligne">

<td>Nom</td><td>Prénom</td><td>Age</td>

</tr>

<tr>

<td><p>aa</p></td><td>bb</td><td>19</td>

</tr>

</table>

</body>

</html>

Nombre de messages : 399 Age : 40 Date d'inscription : 21/01/2007

t'as bien travailler dans ce tp alors tu merite une autre 18.5 tu dois nous faire des cours pas des tp a tarnouna mais vraiment machkoura 3la les effort wa333333333333333333

Nombre de messages : 206 Date d'inscription : 21/01/2007

bon courage radia mé je propose ke tu fasse un commentaire devant chak ligne kom ca on compren mieu c ki passe Smile

Nombre de messages : 128 Age : 38 Date d'inscription : 24/01/2007

t'aurai du au moins mettre un pti com ou bien une ptite expilcation
ou bien meme toi on t'a raconte le css
tu c meme pa son initial
voila pr tes infos

Le langage CSS (Cascading Style Sheets)

Nombre de messages : 128 Age : 38 Date d'inscription : 24/01/2007

CSS est utilisé pour définir les couleurs, les polices, le rendu, et d'autres caractéristiques liées à la présentation d'un document. L'objectif est de bien séparer la structure (écrite en HTML ou similaire) et la présentation (en CSS) du document. Cette séparation fournit un certain nombre de bénéfices, permettant d'améliorer l'accessibilité, de changer plus facilement de structure et de présentation, et de réduire la complexité de l'architecture d'un document. Enfin, CSS permet de s'adapter aux caractéristiques du récepteur.