bonjour j'aimerais bien que quelqu'un m'aide car je n'ai rien compris au language css j'ai relu plusieurs fois l'explication mais je n'ai rien compris.
expliquer moi s'il-vous-plait

merci d'avance

Bonjour,

Ce serait bien que tu nous dises précisément ce qui te pose problème, car je ne peux pas tout expliquer.

ben en faîte ce que j'ai pas compris c'est presque tous, la première page d'explication ça je l'ai compris c'est le reste que j'ai pas compris

Pourtant si tu as compris la première page tu devrais avoir presque tout compris, les deux pages suivantes ne contiennent que la liste des propriétés et classes utilisables.

enfin j'ai compris juste la fin sinon quand il parle de atribu etc à marquer ça je comprend pas

Ce n'est pas très compliqué, les attributs désignent les différents éléments de ton site que tu peux modifier. Par exemple le menu de gauche, le header, le cadre contenant les news, etc...


Supposons par exemple que tu veuilles que la couleur de fond du menu de gauche de ton site soit rouge.

La couleur de fond est "la propriété" que tu souhaites modifier. Rouge est la "valeur" que tu souhaites donner à cette propriété.
Enfin, le menu de gauche est l'élément (ou "attribut" que tu souhaites modifier.

Le nom en CSS du menu de gauche est #meugauche
La propriété permettant de changer la couleur de fond est background-color.
La syntaxe CSS à écrire pour faire ceci est donc
#menugauche {
background-color: red;
}

c'est complexe ^^
voir très .

Dans ce cas, le plus simple est sans doutes que tu n'utilises pas le CSS. Ce n'est pas indispensable, et si tu veux tu as des designs tout faits à disposition sur ce site.

Ou alors vient me voir je vais t'expliqué clairement pour ton site demande moi par Mp

ok ^^

bonjours, je voudrai savoir comment est-ce que l'on fait pour mettre l'entête du site en bas a gauche et aussi pour les menu comment arrondir les borts des titres de menus ??
J'ai un autre problème, çe qu'il y a écrit dans l'entête du menu est écri en gros au milieu et j'arrive pas a le changer. regardez: lien

merci.

Bonjour,

Actuellement tu utilises déjà le CSS ou pas ?
Si ce n'est pas le cas ça ne sert à rien de poser des questions précises comme ça, il faut mieux que tu commences par le début.

Pour le dernier point que tu soulèves tu as réussie à te débrouiller toute seule, non ?

nan en fait j'ai remis comme c'était avant le css, sinon si tu veux voir comment c'était avant je peux le remettre pour que tu voies comment ça donne.

Peux-tu copier ton CSS dans ton prochain message?
Je te montrerais ou tu dois le modifier.

/* Quelques données généralistes */
body {
margin: 0;
padding: 0;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
color: #BA8267;
text-align: center;
background-color:#A1A1A1;
background-attachment:fixed;
text-align : left;
}
td {
background: transparent;
font-family:verdana,arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
color:#AD6765;
padding: 0px;
text-align:left;
}
a {
color: #CF2513;
text-decoration: transparent;
}
a:hover {
color: #A1A1A1;
text-decoration: underline;
}
a img {
border: none;
}
.fborder {
border: #000000 1px solid;
width: 99% !important;
}

.fcaption {
border-top : 1px #A1A1A1 transparent;
border-bottom : 1px  #AD6765 solid;
background-color: #E5E5E5;
background-image:url(http://utiliweb.fr/defaut/titrenews.png);
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
color:#BA8267;
font-weight:bold;
padding: 2px;
text-align: left;
}
.fcaption a{
padding-right:4px;
color:#030303;
}

.casetype1 {
background-color:#EDEDED;
border : 2px #C9C9C9 solid;
padding: 2px;
}
.casetype2 {
border : 1px #AD6765 solid;
background-color: #F7F7F7;
padding: 2px;
}
.casetype3 {
background-color: #AD6765;
font-size: 12px;
padding:2px;
border: 1px solid #A1A1A1;
}
.titre {
font-size: 14px;
text-align : center;
}
/* Début de la mise en page */
#page {
margin-top: 10px;
margin-bottom: 10px;
padding: 0;
width: 780px;
border: 2px solid #C7BFBB;
text-align: left;
background-color :#FBFBFB ;
}
#header {
position:relative;
padding: 0px;
margin: 0px;
height: 116px;
width: 100%;
background-color: #E2E2E2;
background-image:url(http://utiliweb.fr/defaut/header.png);
}
#header h1{
text-align:center;
width: 100%;
padding: 0;
margin: 0 auto;
font-size: 30px;
color: #CF2513;
}
#header h1 a, #header h1 a:hover{margin-right:200px
color: #A1A1A1;
}
#header h2 {
height : 100%;
display : block;
position : absolute;
top : 108px;
left : 3px;
padding: 0;
margin: 0 auto;
font-size: 12px;
text-align: center;
color: #CF2513;
width: 100%;
height:30px;
overflow : hidden;
}
#header h2 a {
color: #C9C9C9;
}
#header h2 a:hover {
color: #C9C9C9;
text-decoration : underline;
}

.body1 {
border-bottom : 2px #A1A1A1 solid;
background-color : #FBFBFB;
padding : 0px;
}
#menugauche {
width: 130px;
height : 100%;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
vertical-align : top;
background-color:#F7F7F7;
border-right : 2px #D1D1D1 solid;
}
#menugauche .titre {
background-image:url(http://utiliweb.fr/defaut/titremenu.png);
padding: 4px;
display : block;
border-bottom : 2px #A1A1A1 solid;
border-style: groove;
border-top : 2px #A1A1A1 solid;
color : #C9C9C9;
background-color: #E5E5E5;
font-weight : bold;
text-align : center;
}
#main {
background-color:#FBFBFB;
text-align : left;
vertical-align : top;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 2px;
padding-right : 2px;
height : 100%;
border-top : 2px #A1A1A1 solid;
}
#main .titre {
font-size : 18px;
font-weight : bold;
color : #8F5553;
}
#footer {
padding: 0;
margin: 0 auto;
width: 8F5553;
background-color : #E2E2E2;
text-align: center;
}
#footer p {
margin: 1;
padding: 10px 0;
text-align: center;
}
/* Fin de la mise en page  */

/* Apparance des news */
.news {
border : 1px #000000 solid;
width : 96%;
border-style: ridge;
}
.titrenews {
background-color:#E5E5E5;
text-align : center;
font-weight : bold;
font-size : 12px;
color : #000000;
height : 27px;
background-image:url(http://utiliweb.fr/defaut/titrenews.png);
border-bottom : 1px #000000 solid;
}
.corpsnews {
background-color:#EDEDED;
text-align : justify;
color : #000000;
padding : 2px;
}
.piednews {
background-color:#EDEDED;
color : #C7A297;
height : 20px;
padding : 4px;
vertical-align : bottom;
}
.imagenews {
max-width:120px;
max-height:120px;
float:left;
padding: 4px;
}
/* Apparance de l\'index du forum et autres tableaux */
.forumheader{
background-color: #DFDFDF;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
color:#000000;
font-weight : bold;
padding:2px;
border: 1px solid #000000;
}
.forumheader A {
font-size: 12px;
color:#000000;
font-weight : bold;
}

#corpsforum {
text-align : left;
background-color : #F7F7F7;
color : #000000;
border-left : 1px #000000 solid;
border-right : 1px #000000 solid;
border-top : 1px #000000 solid;
vertical-align : top;
}

.blocforum {
border : 1px #000000 solid;
}
.forumcolonne1 {
background-color : #EDEDED;
border : 1px #AD6765 solid;
}
.forumcolonne2 {
background-color:#F7F7F7;
border : 1px #AD6765 solid;
text-align : left;
padding : 2px;
}
.forumcolonne3 {
background-color: #EDEDED;
border : 1px #000000 solid;
padding : 2px;
}
.forumcolonne4 {
background-color:#F7F7F7;
border : 1px #D9D9D9 solid;
}
.forumcolonne5 {
background-color: #EDEDED;
border : 1px #000000 solid;
}
.forumcolonne6 {
background-color:#F7F7F7;
border : 1px #D9D9D9 solid;
}
.foruminfo {
background-color : #DFDFDF;
border : 1px #000000 solid;
padding-top : 1px;
    padding-bottom : 1px;
}
.legende {
text-align: center;
width : 100%;
border : 1px #000000 solid;
background-color : #EDEDED;
padding : 2px;
margin-top : 5px;
}
.caselegende {
text-align : center;
}
/* Apparance des commentaires et des messages du forum */
.commentaire {
border-bottom: #000000 1px inset;
width : 85%;
}
#colonneavatar {
width : 212px;
background-color : #EDEDED;
background-repeat:no-repeat;
text-align : center;
border-top : 1px #000000 solid;
border-left : 1px #D1D1D1 solid;
padding : 2px;
vertical-align : top;
}
#menumessage {
background-color : #EDEDED;
border-bottom : 1px #000000 solid;
height : 24px;
padding : 2px;
}
#corpsmessage {
background : #F7F7F7;
padding : 4px;
}
#signature {
border-top : 1px #000000 dashed;
vertical-align : bottom;
padding : 4px;
background-color : #F7F7F7;
}
#reponserapide {
background-color : #EDEDED;
border : 1px #000000 solid;
border-style: outset;
}
/* Attributs supplémentaires */
.button{
font-size: 12px;
text-align:center;
}
.tbox.chatbox {
width: 45%;
margin-left: auto;
margin-right: auto;
}
.spacer {
padding: 0px 0 0px 0;
}

.indent{
padding:4px;
border: 1px solid #000000;
background-color: #EDEDED;
}
.spoiler{
background-color: #EDEDED;
color : #EDEDED;
padding : 4px;
border: 1px #CF2513 solid;
}
.spoiler span{
color: #CF2513;
}

.mediumtext {
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
}

.tbox{
background-color: #ffffff;
border: #000000 1px solid;
color: #000000;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
}
.helpbox {
border: 0px;
background-color: transparent;
color:#000000;
font-size: 10px;
font-family:verdana,arial, Helvetica, sans-serif;
}
.smalltext {
font-size : 11px;
color : #000000 ;
}
.smallblacktext {
font-size : 11px;
color : #000000 ;
}
hr
{display : none}
.cpage_title {
text-align : center;
font-weight : bold;
}
.tableaubb {
border: 1px #000000 solid;
}
 
J'ai utilisé celui qui avais dansles guides mais j'ai pas fini.
et aussi j'arrive plus a mettre de la couleur ça me met que du gris sauf pour la police.

Pour arrondir les bords des titres des menus, il faut utiliser la propriété border-radius. Je te conseille aussi d'enlever la bordure qu'il y'a autour de ces titres.

Ce que tu me dis sur les couleurs est assez surprenant. Quelles couleurs essaies-tu de changer ?

Pour le texte de l'entête, je te fais les modifications directement dans ton CSS.
Compare les deux versions, c'est comme ça que tu progresseras.

/* Quelques données généralistes */
body {
margin: 0;
padding: 0;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
color: #BA8267;
text-align: center;
background-color:#A1A1A1;
background-attachment:fixed;
text-align : left;
}
td {
background: transparent;
font-family:verdana,arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
color:#AD6765;
padding: 0px;
text-align:left;
}
a {
color: #CF2513;
text-decoration: transparent;
}
a:hover {
color: #A1A1A1;
text-decoration: underline;
}
a img {
border: none;
}
.fborder {
border: #000000 1px solid;
width: 99% !important;
}

.fcaption {
border-top : 1px #A1A1A1 transparent;
border-bottom : 1px #AD6765 solid;
background-color: #E5E5E5;
background-image:url(http://utiliweb.fr/defaut/titrenews.png);
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
color:#BA8267;
font-weight:bold;
padding: 2px;
text-align: left;
}
.fcaption a{
padding-right:4px;
color:#030303;
}

.casetype1 {
background-color:#EDEDED;
border : 2px #C9C9C9 solid;
padding: 2px;
}
.casetype2 {
border : 1px #AD6765 solid;
background-color: #F7F7F7;
padding: 2px;
}
.casetype3 {
background-color: #AD6765;
font-size: 12px;
padding:2px;
border: 1px solid #A1A1A1;
}
.titre {
font-size: 14px;
text-align : center;
}
/* Début de la mise en page */
#page {
margin-top: 10px;
margin-bottom: 10px;
padding: 0;
width: 780px;
border: 2px solid #C7BFBB;
text-align: left;
background-color :#FBFBFB ;
}
#header {
position:relative;
padding: 0px;
margin: 0px;
height: 116px;
width: 100%;
background-color: #E2E2E2;
background-image:url(http://utiliweb.fr/defaut/header.png);
}
#header h1{
text-align:center;
width: 100%;
padding: 0;
margin: 0 auto;
font-size: 30px;
color: #CF2513;
}
#header h1 a, #header h1 a:hover{margin-right:200px
color: #A1A1A1;
}
#header h2 {
font-size: 12px;
color: #CF2513;
text-align: left;
padding-top: 90px;
padding-left: 10px;
}
#header h2 a {
color: #C9C9C9;
}
#header h2 a:hover {
color: #C9C9C9;
text-decoration : underline;
}

.body1 {
border-bottom : 2px #A1A1A1 solid;
background-color : #FBFBFB;
padding : 0px;
}
#menugauche {
width: 130px;
height : 100%;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
vertical-align : top;
background-color:#F7F7F7;
border-right : 2px #D1D1D1 solid;
}
#menugauche .titre {
background-image:url(http://utiliweb.fr/defaut/titremenu.png);
padding: 4px;
display : block;
border-radius: 5px;
margin: 3px;
color : #C9C9C9;
background-color: #E5E5E5;
font-weight : bold;
text-align : center;
}
#main {
background-color:#FBFBFB;
text-align : left;
vertical-align : top;
padding-top : 5px;
padding-bottom : 5px;
padding-left : 2px;
padding-right : 2px;
height : 100%;
border-top : 2px #A1A1A1 solid;
}
#main .titre {
font-size : 18px;
font-weight : bold;
color : #8F5553;
}
#footer {
padding: 0;
margin: 0 auto;
width: 8F5553;
background-color : #E2E2E2;
text-align: center;
}
#footer p {
margin: 1;
padding: 10px 0;
text-align: center;
}
/* Fin de la mise en page */

/* Apparance des news */
.news {
border : 1px #000000 solid;
width : 96%;
border-style: ridge;
}
.titrenews {
background-color:#E5E5E5;
text-align : center;
font-weight : bold;
font-size : 12px;
color : #000000;
height : 27px;
background-image:url(http://utiliweb.fr/defaut/titrenews.png);
border-bottom : 1px #000000 solid;
}
.corpsnews {
background-color:#EDEDED;
text-align : justify;
color : #000000;
padding : 2px;
}
.piednews {
background-color:#EDEDED;
color : #C7A297;
height : 20px;
padding : 4px;
vertical-align : bottom;
}
.imagenews {
max-width:120px;
max-height:120px;
float:left;
padding: 4px;
}
/* Apparance de l\\\'index du forum et autres tableaux */
.forumheader{
background-color: #DFDFDF;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
color:#000000;
font-weight : bold;
padding:2px;
border: 1px solid #000000;
}
.forumheader A {
font-size: 12px;
color:#000000;
font-weight : bold;
}

#corpsforum {
text-align : left;
background-color : #F7F7F7;
color : #000000;
border-left : 1px #000000 solid;
border-right : 1px #000000 solid;
border-top : 1px #000000 solid;
vertical-align : top;
}

.blocforum {
border : 1px #000000 solid;
}
.forumcolonne1 {
background-color : #EDEDED;
border : 1px #AD6765 solid;
}
.forumcolonne2 {
background-color:#F7F7F7;
border : 1px #AD6765 solid;
text-align : left;
padding : 2px;
}
.forumcolonne3 {
background-color: #EDEDED;
border : 1px #000000 solid;
padding : 2px;
}
.forumcolonne4 {
background-color:#F7F7F7;
border : 1px #D9D9D9 solid;
}
.forumcolonne5 {
background-color: #EDEDED;
border : 1px #000000 solid;
}
.forumcolonne6 {
background-color:#F7F7F7;
border : 1px #D9D9D9 solid;
}
.foruminfo {
background-color : #DFDFDF;
border : 1px #000000 solid;
padding-top : 1px;
padding-bottom : 1px;
}
.legende {
text-align: center;
width : 100%;
border : 1px #000000 solid;
background-color : #EDEDED;
padding : 2px;
margin-top : 5px;
}
.caselegende {
text-align : center;
}
/* Apparance des commentaires et des messages du forum */
.commentaire {
border-bottom: #000000 1px inset;
width : 85%;
}
#colonneavatar {
width : 212px;
background-color : #EDEDED;
background-repeat:no-repeat;
text-align : center;
border-top : 1px #000000 solid;
border-left : 1px #D1D1D1 solid;
padding : 2px;
vertical-align : top;
}
#menumessage {
background-color : #EDEDED;
border-bottom : 1px #000000 solid;
height : 24px;
padding : 2px;
}
#corpsmessage {
background : #F7F7F7;
padding : 4px;
}
#signature {
border-top : 1px #000000 dashed;
vertical-align : bottom;
padding : 4px;
background-color : #F7F7F7;
}
#reponserapide {
background-color : #EDEDED;
border : 1px #000000 solid;
border-style: outset;
}
/* Attributs supplémentaires */
.button{
font-size: 12px;
text-align:center;
}
.tbox.chatbox {
width: 45%;
margin-left: auto;
margin-right: auto;
}
.spacer {
padding: 0px 0 0px 0;
}

.indent{
padding:4px;
border: 1px solid #000000;
background-color: #EDEDED;
}
.spoiler{
background-color: #EDEDED;
color : #EDEDED;
padding : 4px;
border: 1px #CF2513 solid;
}
.spoiler span{
color: #CF2513;
}

.mediumtext {
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
}

.tbox{
background-color: #ffffff;
border: #000000 1px solid;
color: #000000;
font-size: 12px;
font-family:verdana,arial, Helvetica, sans-serif;
}
.helpbox {
border: 0px;
background-color: transparent;
color:#000000;
font-size: 10px;
font-family:verdana,arial, Helvetica, sans-serif;
}
.smalltext {
font-size : 11px;
color : #000000 ;
}
.smallblacktext {
font-size : 11px;
color : #000000 ;
}
hr
{display : none}
.cpage_title {
text-align : center;
font-weight : bold;
}
.tableaubb {
border: 1px #000000 solid;
}

en fait pour les couleur je voulait mettre du gris assez foncé pour la case 1, 3 et du gris un peu plus clair dans la case 2, en fait des couleur assez foncé mais pas trop ^^".

En couleur de texte (color) ou en couleur de fond (background-color) ?

couleur de fond du menu gauche, et aussi j'arrive plus a changer la police.

pour changer de police, il faut mettre


Pour la couleur de fond du menu gauche, il suffit de changer la propriété "background-color" de #menugauche