mise en page cssRésolu/Fermé

Question

Bonjour, 
laquelle de ces deux méthodes et la meilleure a utilisée et pourquoi svp.

EXEMPLE 1
@charset "iso-8859-1";
body{
		background-color: #335566;
		display: inline-block;		
		width: 100%;
		height: auto;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;	
		text-align: center;
}

div#contenu {
	width:600px;
	height:250px;
	background-color:#FFCC00;
	text-align:left;
	}
		
div#imageframe {
	float:left;
	width:100px;
	height:200px;
	background-color:#FF6699;
	}
	
div#imagecadre {
	width:100px;
	height:200px;
	background-color:#66CC33;
	}
	
div#textebas {
	width:600px;
	height:50px;
	background-color:#cff21f;
	}

----------------------------------------------------------------------------------------------------------------

EXEMPLE 2

@charset "iso-8859-1";
body{
		background-color: #335566;
		display: inline-block;		
		width: 100%;
		height: auto;
		margin: 0px 0px 0px 0px;
		padding: 0px 0px 0px 0px;	
		text-align: center;
}

#contenu {
	width:600px;
	height:250px;
	background-color:#FFCC00;
	text-align:left;
	}
		
#contenu #imageframe {
	float:left;
	width:100px;
	height:200px;
	background-color:#FF6699;
	}
	
#contenu #imageframe #imagecadre {
	width:100px;
	height:200px;
	background-color:#66CC33;
	}
	
#contenu #textebas {
	width:600px;
	height:50px;
	background-color:#cff21f;
	}




merci d'avance! 




Configuration: XP pro
CM=P5b bios=21.04 fsb rated orifgine (1066Mhz)
Processeur=E6600 2.4Ghz 4mo Overclocker a 2.8 ratio:8 fsb rated oc:1399Mhz
fsb:349mhz 
ram=Corsair 2*VS1GB667D2 PC2-5300(333mHz) en dual channel)+1 512 --->Overclock ram:437,2Mhz
Carte vidéo: ATI Radéon HD 5700 Séries
Double écran lcd Asus 1920*1080
Alimentation: everest 80plus 600W
Disque dur:4 hd 16 partitions 2*500Go, 2*1000Go= 3000Go tous en 32mo de cache 
Connection Eth et wifi

opda · Answer

Aucune ce sont les même méthodes.

Par contre la syntaxe donc le sens est différent:

div#contenu { /* propriétés*/

applique les propriétés CSS au div qui a pour id='contenu'

#contenu { /* propriétés*/

applique les propriétés CSS à l'élément(quel qu'il soit) qui a pour id='contenu


Le mieux serait pas de commencer par le début en CSS, c'est la base de savoir nommer et appliquer un style à une(dans le cas d'un id) ou plusieurs (dans le cas d'une class) balises HTML et de savoir comment...

Vous avez aussi les pseudo classes qui sont intéressantes et ont des syntaxes qui permettent de parcourir une arborescence de balises ou de différencier les états d'une balise.

ps: on parle de méthode pour appeler le CSS pour différencier css interne et externe et de la façon dont est appelée un CSS externe(<link> ou @import).

Utilisateur anonyme · Answer

Merci beaucoup de m'avoir répondu. 
je fais un peu de html/xhtml css et php et manipulé des base de donné mysql 
mais apprenant tous seul avec des livre et des tuto souvent je me perd un peu  ou je retiens pas tout. Ajax Javascript  Xml je nage complet meme si j ai aussi un peu boouquiner 

nommer et appliquer un style à une(dans le cas d'un id) ou plusieurs (dans le cas d'une class) balises HTML et de savoir comment...  

ID c'est unique class cela permet d'y faire appel plusieurs fois 
  
pseudo classes 
j ai lu met je connais pas vraiment.je vais regarder ca se soir 

ps: on parle de méthode pour appeler le CSS pour différencier css interne et externe et de la façon dont est appelée un CSS externe(<link> ou @import). 
cela aussi je le savait  

mais j ai tout de même du mal a différentier le sens des deux syntaxe 
div#contenu --->applique les propriétés CSS au div 
#contenu --->applique les propriétés CSS à l'élément(quel qu'il soit) 
 
c'est encore flou dans mon esprit y a un truc que je comprend pas bien 
je te remercie quant meme je vais essaye d'éclaircir ca. 
et y a aussi un truc dans la hiérarchie dans le css que j ai pas compris. 


EXEMPLE 1 

body{ 
div#contenu { 
} 
div#imageframe { 
} 
div#textebas { 
}  

---------------------------------------------------------------------------------------------------- 

EXEMPLE 2 


body{ 
} 
#contenu { 
} 
#contenu #imageframe { 
} 
#contenu #imageframe #imagecadre { 
} 
#contenu #textebas { 
} 

tu vois ce que je veut dire la hierarchie (enfin la manière de les imbriqué ou non.) 



enfin merci bien!! 

Plusieurs problèmes font parfois une solution...

Mise en page css

2 réponses

Discussions similaires

Newsletters