28173 sujets

CSS et mise en forme, CSS3

bonjour tout le monde,
je ne m'y connais absolument pas en ce qui concerne les .css
je commence à me documenter mais il y a quelque chose que je n'ai pas très bien compris :
- un fichier .css agit sur la page toute entière ou seulement sur une partie (comment un paragraphe ou un sommaire) ?

- le .css agit juste sur la mise en forme du texte ou est-ce qu'il contient la structure entière du site (c'est à dire le sommaire (plus ou moins animé) la bannière, les paragraphes, etc...) ?

merci d'avance pour vos explications !
eeuh.. pour les base du css tu peuyx aller sur le Site du Zér0 avec les tutox de M@teo21 pour bien débuter en CSS .. il ne faut que lire et te laisser guider Smiley cligne
en meme temps j'étais dans le meme cas que toi et en ce momen meme je sais a peu pres a quoi cela sert
EN BREF(je pense, qqun peutil le confirmer Smiley biggrin ?)
Cela sert à généraliser toutes les propriétés que tu donnes a tes balise
EXEMPLE

[b]HTML[/b]
<p align="center"> Centré </p>
<p> Par défaut </p>
<p align="center"> Centré </p>

peut, pour prendre moins de place et aller plus vite pour changer les paramètres en masse, être comme ceci

[b]HTML[/b]
<p class="center" > Centré </p>
<p> Par défaut </p>
<p class="center"> Centré </p>
[b]CSS[/b]
#center {
align:center;
}

Bon, cela est un très mauvais exemple Smiley cligne mais bien sur avec un grand site web, il te suffit de changer le .css pour changer laspect entier du site
voila j'aurais pu en raconter un peu plus mais déja si tu les lis base du css de M@teo21 ca sera déja pas mal Smiley smile
Modifié par titoinou (13 Oct 2006 - 21:01)
merci de ta réponse,
en effet je suis en train de lire les tutos du site du zéro
je suis sur le PHP
mais faudrait que je lise celui sur le CSS
a vrai dire, je les commencé mais je voulais justement posé les deux questions posées plus haut!
si quelqu'un à une réponse ...
Salut,

enfaite le css peut à peu pres influencer tout Smiley smile

tu peut faire la mise en forme de tes paragraphe titre etc mais tu peut aussi disposer la stucture graphique du site c'est pour sa qu'on dit separer la structure de la mise en forme je ne c'est si sa repond a tes question mais j'aurais essayer Smiley smile

@+

Bo
laurentb a écrit :

- un fichier .css agit sur la page toute entière ou seulement sur une partie (comment un paragraphe ou un sommaire) ?

Oui, le CSS agit sur toute la page, mais évidemmen, tu peux réguler cela enfin je ve dire que les règles CSS te permettent de controler tout cela
Ex:

body {
BLABLA
}

agit sur toute la page, tout le body
alors que

#paragraphe1 #texte1 {
BLABLA
}

agit sur toutes les class texte1 qui sont contenues dans des balise qui ont pour class paragraphe1 Smiley ohwell
Enfin bon plein de petites règles par ici à apprendre d'ailleurs je suis débuatnat moi aussi Smiley sweatdrop Smiley sweatdrop
Modifié par titoinou (13 Oct 2006 - 22:48)
@titoinou : je te suggère de poursuivre ton apprentissage et de laisser les plus expérimentés apporter leur aide. Ça évitera de semer la confusion avec des exemples pour le moins douteux.

Par exemple :

HTML
<p class="center" > Centré </p>
<p> Par défaut </p>
<p class="center"> Centré </p>

CSS
#center {
align:center;
}

N'a aucune chance de fonctionner Smiley confus
lol oui dsl Smiley confus Smiley confus
en fait chez moi j'ai des ID et j'ai cru que j'avais des class dsl

enfin bon ses question n'était pas non plus spétaculaire, elle n'étaient pas très dure à répondre Smiley biggrin
Modifié par titoinou (14 Oct 2006 - 09:21)
merci beaucoup pour vos renseignements,
vous avez paraitement répondu à mes questions
cependant, peut-on utiliser plusieurs CSS dans une page web?
merci encore
Modifié par laurentb (16 Oct 2006 - 18:21)
laurentb a écrit :
merci beaucoup pour vos renseignements,
vous avez paraitement répondu à mes questions
cependant, peut-on utiliser plusieurs CSS dans une page web?
merci encore


Je ne suis pas un expert mais je crois pouvoir te repondre ...

En fait tu creera une feuille en .CSS qui apres te permettra de faire la mise en forme de TOUT ton site.

Tu fais une relation sur ta page HTML (ou PHP ) afin qu'il charge ta page de CSS.

Ensuite il lit les information de ta feuille de CSS pour mettre en forme la page.

Exemple :

ta feuille CSS que tu aurais par exemple appeler on va dire "miseenforme.CSS" :

ton fichier "miseenforme.css" :

a écrit :


#banniere //qui representera l'emplacement de la banniere//
{
position:absolute;
left: 400px;
top: 120px;
z-index: 1;
}


et dans ton HTML :

dans le header :

a écrit :


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



et enfin dans ton body :

a écrit :


<div id="banniere"> ici tu met ce que tu veux </div>



voila le "ici tu met ce que tu veux" pourrait etre une image par exemple.
elle se placera toujours a 120 pixel du haut de la page et a 400 pixel de la gauche ...

Tu peux creer dans ta page de style autant d'emplacement que tu veux
exemple si tu as 4 boutons a place tu le ferais ainsi dans ton fichier CSS :

a écrit :


#banniere //qui representera l'emplacement de la banniere//
{
position:absolute;
left: 400px;
top: 120px;
z-index: 1;
}

#boutona //qui representera l'emplacement du bouton A//
{
position:absolute;
left: 20px;
top: 130px;
z-index: 1;
}
#boutonb //qui representera l'emplacement du bouton B//
{
position:absolute;
left: 20px;
top: 150px;
z-index: 1;
}
#boutonc //qui representera l'emplacement du bouton C//
{
position:absolute;
left: 20px;
top: 170px;
z-index: 1;
}
#boutond //qui representera l'emplacement du bouton D//
{
position:absolute;
left: 20px;
top: 190px;
z-index: 1;
}



tu n'aura plus qu'a mettre tes bouton dans le HTML ainsi (dans le body) :

a écrit :


<div id="boutona"> LE BOUTON A </div>
<div id="boutonb"> LE BOUTON B </div>
<div id="boutonc"> LE BOUTON C </div>
<div id="boutond"> LE BOUTON D </div>



J'espere que tu m'aura compris Smiley smile
Là je dois dire que c'est très clair!
je vais pouvoir grâce à vos conseils, continuer (ou commencer Smiley lol ) à me former !
Je vous recontact si j'ai de nouveau un problème!
merci encore pour vos réponses claires et rapides!
laurentb a écrit :
merci beaucoup pour vos renseignements,
vous avez paraitement répondu à mes questions
cependant, peut-on utiliser plusieurs CSS dans une page web?
merci encore

Salut.

Oui, on peut utiliser plusieurs feuilles de style sur une seule page web. Il suffit d'ajouter un appel dans le <head> :
<link rel="stylesheet" type="text/css" href="feuil1.css" media="screen" />
<link rel="stylesheet" type="text/css" href="feuil2.css" media="screen" />
On appelle ainsi les 2 CSS feuil1 & feuil2. A noter que, puisque feuil2 vient après feuil1 dans la lecture de la page, les styles de feuil2 vont écraser ceux de feuil1, si on a défini 2 fois la même propriété pour le même élément !

Il existe aussi les feuilles de style réservées à l'impression, à l'affichage sur un appareil mobile, etc.