Définir les styles par div

Question

Je suis nouveau à css et non un programmeur. Je comprends ce qu'est une classe et je comprends ce qu'est une div, mais ce que je n'arrive pas à trouver, c'est comment définir des styles par div.

Toute aide appréciée,

Joost Verplancke

Answer 1

<div class="featured">Featured</div> 

<style type="text/css"> 
     .featured { padding:5px; font-size:1.4em; background-color:light-yellow; } 
</style> 

Pour accéder à l'utilisation de la classe (.) Et ids utiliser (#) avant le nom.

Answer 2

Dans votre HTML

<div class="myClass">Look at me!</div> 

Dans votre CSS

.myClass 
{ 
    background-color:#eee; 
} 

EDIT

Comme l'a souligné Dave, vous pouvez affecter plusieurs classes à un élément. Cela signifie que vous pouvez moduler vos styles selon vos besoins. Aide avec le DRY principle.

Par exemple, dans votre code HTML

<div class="myClass myColor">Look at me too!</div> 

Dans votre CSS

.myClass 
{ 
    background-color:#eee; 
    color:#1dd; 
} 

.myColor 
{ 
    color:#111; 
} 

Vous devez également noter que l'ordre dans l'attribut de classe n'a pas d'importance si différents styles ont des paramètres contradictoires. C'est-à-dire, class="myClass myColor" est exactement le même que class="myColor myClass". Le paramètre en conflit utilisé est determined by which style is defined last dans le CSS.

Cela signifie, dans l'exemple ci-dessus, pour faire la color de myClass être utilisé au lieu du color de myColor, vous devez changer votre CSS pour les passer autour de la manière suivante

.myColor 
{ 
    color:#111; 
} 

.myClass 
{ 
    background-color:#eee; 
    color:#1dd; 
} 

Answer 3

Vous créer soit une classe par div ou donne à chaque div une valeur d'identifiant unique.

Vous devez ensuite créer un style CSS différent pour chaque classe ou identifiant, ce qui donnerait le style à l'élément div correspondant.

#specialDiv { 
    font-family: Arial, Helvetica, Sans-Serif; 
} 

<div id="specialDiv">Content</div> 

Ou

.specialDiv { 
    font-family: Arial, Helvetica, Sans-Serif; 
} 

<div class="specialDiv">Content</div> 

Vous pouvez également faire des styles en ligne pour chaque élément div:

<div style="font-family: Arial, Helvetica, Sans-Serif;">Content</div> 

Answer 4

<div style="your css goes here"></div>

Edition - Ne fais pas ça, annakata est juste. J'ai mal compris votre question. Vous avez déjà reçu beaucoup de bonnes réponses qui vous donnent l'information dont vous avez besoin.

Answer 5

Si vous devez définir le style une fois et une seule fois que vous voulez faire ceci:

#test 
{ 
    background-color: red; 
} 

Si vous avez besoin de le réutiliser (une classe), alors vous aurez envie de faire quelque chose comme ceci:

.test 
{ 
    background-color: red; 
} 

Ensuite, lorsque vous êtes prêt à l'utiliser simplement:

<div id="test"> this is a test </div> 

pour # type et:

<div class="test"> this is a test </div> 

Pour le type de classe.

Ma recommandation est d'aller à: http://www.w3schools.com/css/

Beaucoup d'aide sur CSS là. J'essaierais d'éviter le css en ligne car il a parfois un moyen de faire croire aux artistes/programmeurs que c'est plus facile à utiliser en ligne. Vous vous retrouvez avec une page web avec tous ces styles en ligne qui pourraient vraiment être centralisés et réutilisés. Alors soyez prudent avec inline. Je ne recommande pas de les utiliser