chapitre3 css

7/25/2019 Chapitre3 CSS

1/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


2/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - J17 ,K,8.+,D :"" 0(*L7, +,4 .(+/0,4D +,4 0(*+,*74D +,4 817C,4D +,4

+/C3,4D +1 51*2,*7D +1 +17C,*7D +,4 /81C,4 )M177/N7,O.+13D +,4 .(4/2/(33,8,324 9L(+*9,4 ,2 P/,3 )M1*27,4

05(4,4Q

!"# %"&'(("# )" #*+(", -.&/0&.' %1'/" 2

R3 H#'ID .(*7 8,227, ,3 G(78, *3 2/27, 3(*4 *2/+/4(34 +1 P1+/4, SG(32T>

!"# %&%'()% *

Mon titre

ici

:, F*/ )(33, +, 794*+212 4*/L132 -

!"# %&%'( &)&

!81C/3(34 F*, 3(*4 16(34 U 2/27,4 )134 +1 8V8, .1C,D 1L,0 +1 8V8, .794,3212/(3D 3(*4 79.92,7/(34

U G(/4 3(27, P1+/4, SG(32T 1L,0 2(*4 4,4 1227/P*24> :,0/ )(33,71/ *3 0(), P1L17) ,2 3(*4 (P+/C,71/ W ),

8*+2/.+,4 8()/G/012/(34 +, X(*7 (Y +M(3 4(*51/2, 8()/G/,7 +1 0(*+,*7 ), 3(4 2/27,4>

I1 4(+*2/(3D 49.17,7 +, 0(), ,2 +1 .794,3212/(3 1L,0 +,4 :""

$L,0 +,4 G,*/++,4 ), 426+,D (3 .,*2 7,C7(*.,7 +,4 /3G(7812/(34 ), .794,3212/(3 *3, G(/4 .(*7 2(*2,.(*7 3(27, .1C,>

I1 G/C*7, 4*/L132, 8(327, 0, F*, )(33, +1 8V8, .1C, 4134 :"" .*/4 1L,0 +, :"">


3/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - R++, .(4, +,4 P14,4 ), 0, +13C1C, F*/

.,78,2 ), .794,32,7 41 .1C, [,PD 0(88, +,4 0(*+,*74D +,4 817C,4D +,4 .(+/0,4 ), 017102N7,4D ,20>

:"" A - 1..17*, ,3 =ZZZ .*/4 0(8.+929, .17 :"" A>=D 0,22, 3(*L,++, L,74/(3 ), :"" 71X(*2, ),3(8P7,*4,4 (.2/(34> ?3 .,*2 )94(781/4 *2/+/4,7 ),4 2,053/F*,4 ), .(4/2/(33,8,32 27N4 .790/4,4D F*/

3(*4 .,78,22,32 )M1GG/05,7 ),4 9+98,324 (Y (3 +, 4(*51/2, 4*7 +1 .1C,>

:"" ; - 0M,42 +1 ),73/N7, L,74/(3D F*/ 1..(72, ),4 G(302/(331+/294 .172/0*+/N7,8,32 122,3)*,4 0(88,

+,4 P(7)*7,4 177(3)/,4D +,4 )9C71)94D +,4 (8P7,4D ,20>

7&"(# #.4* ("# 1314*18"# )" 566 2

:"" G*2 *3, 79L(+*2/(3 )134 +M*3/L,74 ), +1 0(30,.2/(3 \,P> I,4 1L1321C,4 0(307,24 ), :"" 4(32 +,4

4*/L1324 -

I, 0(327]+, ), +1 .794,3212/(3 ), .+*4/,*74 )(0*8,324 .17 *3, 4,*+, G,*/++, ), 426+, ^

@3 0(327]+, .+*4 .790/4 ), +1 .794,3212/(3 ^

_,4 .794,3212/(34 )/GG97,32,4 1..+/F*9,4 W ),4 26.,4 ), 89)/14 )/GG97,324 BW +M90713D W

+M/8.7,44/(3D ,20>E ^

_, 3(8P7,*4,4 2,053/F*,4 9L(+*9,4 ,2 4(.5/42/F*9,4>

_134 0, F*/ 4*/2D 3(*4 L,77(34 0(88,32 :"" G(302/(33, 79,++,8,32 ,2 0(88,32 0(88,30,7

." /,00'() /11 2,(3)+,(('4)4+5 6

_134 0, 051./27,D 3(*4 1..7,3)7(34 W G1P7/F*,7 3(27, .7,8/N7, G,*/++, ), 426+,> `(*4 41*7(34 0,

F*M,42 +, 8()N+, :"" ), P14, ,2 F*,+4 4(32 +,4 0(),4 390,441/7,4 .(*7 *2/+/4,7 :"" )134 *3 )(0*8,32

H#'I>

a,1*0(*. ), .7(.7/9294 ),4 G,*/++,4 ), 426+, ,3 01401), B:""E 4(32 4/8/+1/7,4 W 0,++,4 ), H#'I> "/

3(*4 1L(34 +M51P/2*), )M*2/+/4,7 H#'I .(*7 +1 .794,3212/(3D 3(*4 7,0(331b27(34 )(30 P,1*0(*. ),

0,4 0(),4> c(6(34 *3 ,K,8.+, 0(307,2>

! !1 #+4*19" 566 )" :1#" ;

I1 )9G/3/2/(3 ), P14, )M*3 426+, ,42 4/8.+, -

a1+/4, d.7(.7/929 ), 426+,- L1+,*7^ .7(.7/929 ), 426+,- L1+,*7e

RK,8.+, = -

$L,0 H#'ID 3(*4 +M1*7/(34 G1/2 0(88, 0,0/ -

?@AABBBB?C

$L,0 :""D (3 .,*2 (P2,3/7 +, 8V8, 794*+212 0(88, 0,+1 -

:.)+ D:1=E8/.&4)F=.(./; @AABBBBGH


4/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - R2 )134 L(27, )(0*8,32D 2(*2,4 +,4 P1+/4,4

SH;T 1*7(32 0(88, 426+, $7/1+ ,2 /21+/F*,>

:(88, 3(*4 +M1*7(34 7,817F*9D +,4 0(),4 4(32 .+*4 (* 8(/34 /),32/F*,4 .(*7 H#'I ,2 :""> :,4

,K,8.+,4 /++*427,32 9C1+,8,32 +, 8()N+, G(3)18,321+ ), :"" -

",+,02(7 d.7(.,726-L1+*,^Qe

." /,00'() *775+89'$ /11 : 9( ;,390'() ? 6

Il y a trois faons d'appliquer le style CSS un document HTML.

dans un fichier .css (mthode la plus recommande) ;

dans l'en-tte du fichier HTML ;

directement dans les balises du fichier HTML via un attribut style (mthode la moins

recommande).

Elles sont toutes expliques ci-dessous :

" Dans un fichier .css (recommand)

?3 907/2 +, 0(), :"" )134 *3 G/05/,7 4.90/1+ 16132 +M,K2,34/(3 g >044 h> :M,42 +1 8925(), +1 .+*4

.712/F*, ,2 +1 .+*4 4(*.+,> :,+1 3(*4 9L/2, ), 2(*2 89+13C,7 )134 *3 8V8, G/05/,7> BJ(*7 +, 7,42,D

3(*4 *2/+/4,7(34 0,22, 8925(), .(*7 2(*4 +,4 ,K,8.+,4>E

!"#$%&

!"()*&

!$(#)+"),-(#./0#123/4&!%567,(%./-#8%(-"((#/",(1./-#8%(9+--/4&

!#5#%(&:,($5(,- #(-#- *0 ;!4"()*&

!=>*8&

!"?&@>6 -0A(, -5#(!4"?&

!A&B>6C>0, (# =5(6D(60( -0, $>6 -5#( E!4A&

!A&:>0, %( $>$(6#F $>6 -5#( (-# 06 A(0 !($&D5*(!4($&9 :)#5(6#(G (6+>,( 06 A(0 E!4A&

!4=>*8&

!4"#$%&

`(2,i +, 0(32,3* ), +1 +/C3, 044 ,2 0517C9 ), +1 8/4, ,3 G(78,>

$ F*,++, P1+/4, H#'I +1

.7(.7/929 4j1..+/F*,> RK>

a()6D H;D Q

I1 .7(.7/929D .17 ,K,8.+,

+1 0(*+,*7 )j177/N7,O.+13

P10kC7(*3)O0(+(7 ^

I1 L1+,*7 ), +1 .7(.7/929D .17

,K,8.+, +1 0(*+,*7 )j177/N7,O

.+13 ,42 7(*C, - l


5/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


6/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


7/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - 6 -0A(, -5#(!4"?&

!A&B>6C>0, (# =5(6D(60( -0, $>6 -5#( E!4A&

!A&:>0, %( $>$(6#F $>6 -5#( (-# 06 A(0 !($&D5*(!4($&9 :)#5(6#(G (6+>,( 06 A(0 E!4A&

!4=>*8&

!4"#$%&

Testez, vous verrez que le rsultat est le mme.

" Directement dans les balises (non recommand)

Dernire mthode, manipuler avec prcaution : vous pouvez ajouter un attribut style n'importe quelle balise. Vous insrerez votre code CSS directement dans cet attribut :

!"#$%&

!"()*&

!$(#)+"),-(#./0#123/4&

!#5#%(&:,($5(,- #(-#- *0 ;!4"()*&

!=>*8&

!"?&@>6 -0A(, -5#(!4"?&

!A-#8%(./+>%>,I =%0(J/&B>6C>0, (# =5(6D(60( -0, $>6 -5#( E!4A&

!A&:>0, %( $>$(6#F $>6 -5#( (-# 06 A(0 !($&D5*(!4($&9 :)#5(6#(G (6+>,( 06 A(0 E!4A&

!4=>*8&!4"#$%&

Cette fois, seul le texte du premier paragraphe (ligne 11), dont la balise contient le code

CSS, sera color en bleu (figure suivante).


8/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


9/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


10/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


11/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


12/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


13/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


14/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


15/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


16/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


17/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


18/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -

:510*3, ), 0,4 P(b2,4 ,42 0(342/2*9, )j*3 0(32,3*D )j*3 ,4.10,8,32 /3297/,*7D )j*3, P(7)*7,D ,2

)j*3, 817C, ,K2,73,> c(/0/ +,4 .7(.7/9294 :"" F*/ .,78,22,32 ), )92,78/3,7 +,4 )/8,34/(34D +1

0(*+,*7D +, 426+, ), 0510*3 ), 4,4 0(342/2*1324 -

K1/8'4- 817C, ,K2,73, ), +1 P(b2, B27134.17,32,E^

:./)"/- +1 P(7)*7, ), +1 P(b2,^

-1))'48- 7,.794,32, *3 ,4.10, 1*2(*7 )* 0(32,3* ), +1 P(b2,^


19/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -

F"! G,$;'$

Permet de dfinir les bordures autour des lments.

Liste des proprits border :

- border-style

Border-style vous permet de prciser la taille du bord. Les bords peuvent tre en pointill, en

trait, avec ligne continue, une double ligne, etc.

p {border-style:solid;}

Vous pouvez galement utiliser :

dashed (en tirets) ; dotted (en pointills) ; double (double); ridge; inset; outset (en 3D)

- border-color

Border-color vous permet de prciser la couleur du bord.

p {border-color:black}

-border-width :

Dfinit lpaisseur de la bordure.

Exemple :

p {border-width:5px}

Remarque : Les proprits border-width, border-styleet border-color regroupent elles-

mmes les proprits top, left, bottomet right.


20/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - *$I+(:(88, )/2 .7909),88,32D K1/8'47,.794,32, +1 817C, ,K2,73, ), +1 P(b2,> c(*4 .(*L,i 8()/G/,7

+,4 ,4.10,4 51*2D )7(/2D P14 ,2 C1*05, /3)9.,3)188,32 ),4 1*27,4>


21/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


22/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -


23/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - I,4 L1+,*74 .(44/P+, - /34/),^ (*24/),^

- ('#*F#*+(" ; r100(*70/ C+(P1+ L,74 +,4 .7(.7/9294 ),4 +/42,4 - *+-" -.#'*'.4 &/(VWG

K ?'& 5+'(&`(*4 .(*L(34 1..+/F*,7 1*K +/,34 0, F*, 3(*4 1L(34 )9XW L* )134 +,4 .172/,4 .7909),32,4 B0M,42O

WO)/7, W 0513C,7 +,4 0(*+,*74 ,2 +,4 .(+/0,4D +,4 4(*+/C394D ,20>E> I1 3(*L,1*29D 0M,42 F*, :"" .,78,2 ),

)9G/3/7 0,4 .7(.7/9294 )/GG97,88,32D 4,+(3 F*, +, +/,3 ,42 3'#'*XD 4.4 3'#'*X, 1=*'3XD (* 4/ +, 0*74,*7 +,

#&/3.("> :,+1 .,78,2 )M1X(*2,7 ),4 ,GG,24 .+1/41324 ,2 *2/+,4 W L(4 4/2,4 \,P> J(*7 0(327]+,7 0,4 ,GG,24D

(3 *2/+/4, 0, F*M(3 1..,++, ),4 -#"&).F=(1##"#>

7&Y"#*F=" 0&Y&4" -#"&).F=(1##" 2

@3, .4,*)(O0+144, .,78,2 ), 2,3/7 0(8.2, ), 0(3)/2/(34 ,2 9L93,8,324 )/GG97,324 .(*7 +1

)9G/3/2/(3 )M*3, .7(.7/929 4*7 *3, P1+/4, H#'I>

c(6(34 *3 ,K,8.+,> :(88, L(*4 +, 41L,iD +,4 +/,34 4(32 )9G/3/4 ,3 H#'I 1L,0 ),4 P1+/4,4 S1T>

?3 .,*2 )(30 *2/+/4,7 1 0(88, 49+,02,*7 )134 :"" -

a {color: blue;}

@3 +/,3 ,42 4*40,.2/P+, )M1L(/7 .+*4/,*74 92124> J17 ,K,8.+,D /+ .,*2 V27, L/4/29 (* 3(3> c(*4

.(*L,i *2/+/4,7 ),4 .4,*)(O0+144,4 .(*7 144/C3,7 ),4 426+,4 )/GG97,324 1*K +/,34 L/4/294 ,2 3(3 L/4/294>

1;('4E d0(+(7- P+*,^e

1;3'#'*") d0(+(7- 7,)^e

@2/+/4(34 7,4.,02/L,8,32 1-+/3k ,2 1-L/4/2,) .(*7 +,4 +/,34 3(3 L/4/294 ,2 .(*7 0,*K L/4/294> I,4

+/,34 102/G4 (32 .(*7 .4,*)(O0+144, 1-102/L,D ,2 +1 .4,*)(O0+144, 1-5(L,7 /32,7L/,32 +(74F*, +, 0*74,*7

4*7L(+, +, +/,3>

`(*4 1++(34 81/32,3132 ,K18/3,7 0510*3, ),4 F*127, .4,*)(O0+144,4 1L,0 ),4 ,K,8.+,4 ,2 ),4,K.+/012/(34 4*..+98,321/7,4>

!1 -#"&).F=(1##" ;('4E

I1 .4,*)(O0+144, -+/3k ,42 *2/+/49, .(*7 +,4 +/,34 8,3132 1*K .1C,4 F*, +M*2/+/412,*7 3M1 .14

L/4/29,4>

_134 +, 0(), 4*/L132D +,4 +/,34 3(3 L/4/294 4,7(32 ,3 P+,* 0+1/7>

a:link {color: #6699CC;}

!1 -#"&).F=(1##" ;3'#'*")

I1 .4,*)(O0+144, -L/4/2,) ,42 *2/+/49, .(*7 +,4 +/,34 8,3132 1*K .1C,4 F*, +M*2/+/412,*7 1L/4/29,4> J17 ,K,8.+,D +, 0(), 4*/L132 )(33,71 +1 0(*+,*7 81*L, G(309 W 2(*4 +,4 +/,34 L/4/294 -


24/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -

:,2 ,K,8.+, 8(327, ),4 +/,34 102/L94 )(32 +1 0(*+,*7 )M177/N7,O.+13 ,42 X1*3, -

a:active {background-color: #FFFF00;}

!1 -#"&).F=(1##" ;M.3"/

I1 .4,*)(O0+144, -5(L,7 ,42 *2/+/49, +(74F*, +, .(/32,*7 ), +1 4(*7/4 4*7L(+, *3 +/,3>

?3 .,*2 4M,3 4,7L/7 .(*7 079,7 ),4 ,GG,24 /3297,441324> J17 ,K,8.+,D 4/ 3(*4 L(*+(34 F*, 3(4

+/,34 4(/,32 (713C, ,2 ,3 /21+/F*,4 1* 4*7L(+ )* .(/32,*7D +, 0(), :"" ),L71/2 V27, +, 4*/L132 -

a:hover {

color: orange;

font-style: italic;

}

U9"K-("# ;

U#-1="K"4* )"# ("**/"# ;

:(88, /3)/F*9 1L132D (3 .,*2 1X*42,7 +M,4.10,8,32 ,327, +,4 +,227,4 1L,0 +1 .7(.7/929

+,22,7O4.10/3C> :,+1 4M1..+/F*, 1*K +/,34 .(*7 *3 ,GG,2 4.90/1+ -

a:hover {

letter-spacing: 10px;

font-weight:bold;

color:red;

}

PLZ[65[!U6 "* K'4=&("#

`(*4 1L(34 )9XW L* +1 .7(.7/929 *"9*F*/14#%./K F*/ .,78,2 ), P140*+,7 ,327, ),4 +,227,4

81X*40*+,4 ,2 8/3*40*+,4>

R++, .,*2 1*44/ 4,7L/7 .(*7 079,7 *3 ,GG,2 4*7 +,4 +/,34 -

a:hover {

text-transform: uppercase;

font-weight:bold;

color:blue;

background-color:yellow;

}

Supprimer le trait sous les liens


25/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -

a {text-decoration:none;}

L ?M+;'()+2+3*)+,( N35*&& ') +;O

L"! ?'& 35*&&'& B!+ .,*2 4M1L97,7 /3297,44132 )M1GG,02,7 ),4 426+,4 )/GG97,324 W ),4 8V8,4 P1+/4,4> J(*7 0,+1 +,4

4.90/G/012/(34 :"" (32 /327()*/2 +, 0(30,.2 ), 0+144,>

I1 )9G/3/2/(3 ),4 0+144,4 ,42 1*44/ 4/8.+, F*, 0,++,4 ),4 426+,4> R++, 0(34/42, W .790/4,7 +1 P1+/4,

49+,02/(339, B0(88, .(*7 *3, )90+1712/(3 ), 426+,ED .*/4 ), +*/ 1X(*2,7 *3 .(/32 B>E ,2 +, 3(8 F*,

+M(3 4(*51/2, )(33,7 W +1 0+144,> I, 3(8 ), +1 0+144, .,*2OV27, 0(8.(49 ), +,227,4 B100,32*9,4 (*

3(3ED ), 05/GG7,4 ,2 ), 2/7,24 -

6+4*19"-

balise.nom_de_classe {proprit de style: valeur ; proprit de style: valeur ; }

?Y g `(8w),w+1w0+144, h 7,.794,32, +, 3(8 )(339 W +1 0+144,>

RK,8.+, -

p.rouge {font: Verdana 12px; color: #FF0000; }

L--"( )Y&4" =(1##" ;

J(*7 1..,+,7 *3, 0+144, )134 +, 0(), H#'ID /+ 4*GG/2 ), 71X(*2,7 *3 1227/P*2 =(1##W +1 P1+/4, -

Texte mettre en rouge

!"# =(1##"# &4'3"/#"(("# ;

!+ ,42 .(44/P+, ), 3, .14 .790/4,7 ), P1+/4,D 1*F*,+ 014 +1 0+144, .(*771 V27, *2/+/49, )134

3M/8.(72, F*,++, P1+/4, .(*7 +1F*,++, +, 426+, 49+,02/(339 1 *3 4,34 x ?3 .17+, 1+(74 ), =(1##"

&4'3"/#"(("B.17G(/4 "#$%%& '()*+&()$(,&E> I1 )9G/3/2/(3 )M*3, 2,++, 0+144, 4, G1/2 ,3 .7909)132 2(*2

4/8.+,8,32 +, 3(8 ), +1 0+144, )M*3 .(/32

.Nom_de_la_classe {proprit de style: Valeur; proprit de style: Valeur ...}

RK,8.+, -

"(/2 +1 0+144, g /8.(72132 h 4*/L132, -

.important {font-type: arial; color: red; font-weight: bold}

IM1..,+ ), 0,22, 0+144, .,*2 V27, G1/2 W .172/7 ), 3M/8.(72, F*,+ 9+98,32 H#'I .(*7 +,F*,+ +1

)9G/3/2/(3 ,42 L1+/), -


26/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; -

"/ .17 0(327, L(*4 4(*51/2,i *2/+/4,7 ),4 407/.24 1L,0 +,4 G,*/++,4 ), BL(/7 .+*4 +(/3 )134 +,

0(*74ED +1 3(2/(3 ), !_ L(*4 4,71 1+(74 /3)/4.,341P+,>

!S?' $'I$,97'0'() ;M%5%0'()& B N&7*( ') ;+TO!+ 177/L,71 .17G(/4 F*, L(*4 16,i P,4(/3 )M1..+/F*,7 *3, 0+144 B(* *3 /)E W 0,721/34 8(24 F*/D W

+M(7/C/3,D 3, 4(32 .14 ,32(*794 .17 ),4 P1+/4,4>"/D .17 ,K,8.+,D (3 L,*2 8()/G/,7 *3/F*,8,32 g

P/,3L,3*, h )134 +, .171C71.5, 4*/L132 -

Bonjour et bienvenue sur mon site !

:,+1 4,71/2 G10/+, W G1/7, 4M/+ 6 1L1/2 *3, P1+/4, 1*2(*7 ), g P/,3L,3*, h 81/4D

81+5,*7,*4,8,32 /+ 3M6 ,3 1 .14>

I,4 P1+/4,4 6]L^,2 _`aF*/ 0791/,32 1/34/ ),4 .,2/24 P+(04 .172/0*+/,74 )134 +, )(0*8,32 4134

),L(/7 7,.144,7 .17 +,4 9+98,324 427*02*7,+4 )* H28+ 0+144/F*,>

`(2(34 F*, "J$` ,2 _!c 4M*2/+/4,32 2(*X(*74 1L,0 +,4 0+144,4 ,2 +,4 !_>

6]L^


27/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

:5.; - >> Sz"J$`T .,78,2 )M1..+/F*,7 ),4 426+,4 W ),4 9+98,324 ), 2,K2, )M*3

.171C71.5, (* 4/ L(*4 .79G97,i W *3 8(70,1* ), .171C71.5,> $/34/ (3 .,*2 907/7, .(*7 +j,K,8.+,

.7909)132 -

Bonjour et bienvenue sur mon site !

$L,0 +1 0+144 41+*212/(3 ,42 )9G/3/2 0(88, 4*/2 -

.salutations

{

color: blue;

}

_`a

I1 P1+/4, S_!cT >>> Sz_!cT ,42 *2/+/49, .(*7 )9G/3/7 *3, )/L/4/(3 (* *3, 49+,02/(3 )134 *3

)(0*8,32 528+> R++, ,42 4(*L,32 *2/+/49, .(*7 C7(*.,7 +,4 9+98,324 ), 26., P+(0 ,2 +,*7 1..+/F*,7 *3

426+,>

RK,8.+, = -

Paragraphe dintroduction :

un autre paragraphe>

$L,0 +1 )9G/3/2/(3 ), +1 0+144, /327()*02/(3 -

.introduction

{

font-type : arial ; font-size : 12px ; color : blue

}

RK,8.+, A -

Banane

Pomme

Fraise


28/28

!"#$ #$&$ '()*+, - $..+/012/(34 56.,789)/14

Pomme de terre

Tomate

Ognion

_134 3(27, G,*/++, ), 426+,D 3(*4 .(*L(34 )9G/3/7 +,4 !_ 4*/L132 -

#fuit{background: yellow}

#legume{background: green}

chapitre3 css

Documents