28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J’avais une petite question.
Pourquoi ne pas utiliser que des class en css ?

Par exemple j'utilise un id pour une mise en page sur mon site qui ne se répète donc qu'une seul fois --> mon site et bien valide w3c

par contre si je souhaite par la suite sur la même page utiliser la même mise en forme avec le css je suis donc obligé de transformer mon id en class.

Pourquoi ne pas tout mettre en class de suite ?

Qu’elle avantage avons nous à mettre des id a par le fait de rattaché un class a un id ?
Hello,

lire Quelle est la différence entre une classe et un id.


Edit: j'ajouterais aux arguments de Raphaël que le traitement est optimisé avec l'id (en CSS et en JavaScript) puisque dès que l'élément est trouvé la recherche s'arrête là, contrairement à une classe car il faut alors parser tout le document pour vérifier qu'un autre élément n'a pas cette classe d'affectée.
Modifié par Heyoan (27 Jul 2009 - 23:14)
Salut,
Heyoan a écrit :
puisque dès que l'élément est trouvé la recherche s'arrête là, contrairement à une classe car il faut alors parser tout le document pour vérifier qu'un autre élément n'a pas cette classe d'affectée.

C'est vrai en théorie.

Prenons ce code :

<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8" />
   <title>Test</title>
   <style> 
   #content
   {
      background : #dedede;
   }
   </style>
</head>
<body>

<p id="content">Texte</p>
<p id="content">Texte</p>

</body>
</html>

Je suis conscient qu'il n'est pas valide, mais les deux éléments prennent le style associé.
Ah oui. Tu as raison pour le CSS. Je suis tellement habitué à écrire du code valide que je ne m'en étais jamais rendu compte ! Smiley lol

Par contre pour le JavaScript il semble bien que la recherche s'arrête dès qu'un id qui va bien a été trouvé :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Test</title>
</head>
<body>
<p id="content">Texte</p> 
<p id="content">Texte</p> 
<script type="text/javascript">
document.getElementById("content").style.backgroundColor = 'red';
</script>
</body>
</html>

Modifié par Heyoan (28 Jul 2009 - 19:12)
Le choix de l'utilisation d'un identifiant ou d'une classe, lorsque les deux sont possibles, est aussi une question de méthodologie. Cela relève notamment des habitudes personnelles ou des conventions fixées pour une équipe ou un projet.
Administrateur
Bonjour,

perso j'ai un seul header (de page, je précise à cause d'HTML5), un seul footer, un seul formulaire de recherche (ou pas, mais je le sais en intégrant la première maquette fournie par le client), un seul ... etc pour toute la charte graphique d'un site.
Modifié par Felipe (29 Jul 2009 - 10:21)