Aujourd'hui c'est "grand ménage sur mon forum"

Tyli · Sujet: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 16:09

Re-bonjour

Aujourd'hui je suis motivée pour remettre un peu d'ordre sur mon forum , je suis sur mon Css et j'avoue que c'est le grand bazar !! ma feuille est remplie de codes piochés à droite à gauche que j'ai trouvé aux cours de mes pérégrinations sur le net !! seulement voilà maintenant je ne sais plus à quoi correspond tous ces codes Very Happy

Y'a t'il un moyen pour bien les répertorier ?

Voici mon Css

Spoiler:

Code:

.code {
-moz-border-radius-bottomleft:20px;
-moz-border-radius-bottomright:20px;
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
background-color:#B9B58E;
padding:10px;
}
.spoiler {
-moz-border-radius-bottomleft:20px;
-moz-border-radius-bottomright:20px;
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
background-color:#B9B58E;
padding:5px;
}
.quote {
-moz-border-radius-bottomleft:20px;
-moz-border-radius-bottomright:20px;
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
background-image:(URL du Image de Fond CODE-préf. taille 200x200px en jpg);
padding:10px;
}
input,textarea, select {
color : code couleur;
font: normal 11px Verdana,Arial,Helvetica,sans-serif;
border-color : code coleur;
border-radius: 9px 9px;
-moz-border-radius: 9px;
}
.forumline{
-moz-border-radius: 20px 20px 20px 20px ;
border-bottom: 6px #5A5947 solid;}
.forumline{border: 8px #5A5947 solid;}

A:hover{text-transform:uppercase;}

a:hover{font-style:italic;}

.cattitle{
font-size: 25px ;
}

th.secondarytitle {
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;}

table.ipbtable tfoot td {
background-color: #f27330;
}

.name {
font-size : 18px;
}

textarea {
border: 0px;
border-left: 2px solid #f01dad;
border-right: 2px solid #f01dad;
-moz-border-radius : 5px;
}

A:hover
{
background-color:transparent;
background-image:url(http://img315.imageshack.us/img315/8362/35co.gif);
}

.name a
{
border-top: 2px dotted #999900;
border-bottom: 2px dotted #999900;
}

a { text-decoration: none; }

.row1 a {
font-weight:bold;
}

div.signature
{
font-family:Monotype Corsiva;
}

.postdetails.poster-profile a img {
-moz-border-radius-bottomleft:2px;
-moz-border-radius-bottomright:2px;
-moz-border-radius-topleft:2px;
-moz-border-radius-topright:2px;
border: 2px solid #006600;
}

blink {
visibility: expression((function(){
if (!window.IEBlink) {
window.IEBlink = "visible";
setInterval(function() {
window.IEBlink = (window.IEBlink=="visible"?"hidden":"visible");
var blinks = document.getElementsByTagName("blink");
for (var i=0; i < blinks.length; i++) { blinks[i].style.visibility=window.IEBlink; }
}, 700)
}
return "";
})());
}

.postdetails.poster-profile a img {
background-color: #006600;
-moz-border-radius-bottomleft:10px;
-moz-border-radius-bottomright:10px;
-moz-border-radius-topleft:10px;
-moz-border-radius-topright:10px;
border-top: 5px solid #336666;
border-bottom: 5px solid #336666;
border-left: 5px solid #669900 ;
border-right: 5px solid #669900;
}

a.forumlink {
text-shadow: #FFFFFF 2px 2px 2px;
}
.row3 a {
text-shadow: #FFFFFF 2px 2px 2px;
}

.name div span {
text-shadow: #FFFFFF 2px 2px 2px;
}

#textarea_content iframe, #text_editor_iframe, #text_editor_textarea { /*encadrÃ© rÃ©ponse rapide */
border: 8px solid #336666;
}

.button2{ -moz-border-radius: 5px;}

**Zeco** · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 16:18

Hello...

Tout d'abord, on peut concentrer les border radius et toutes les sous propriétés, ce qui donne :

Spoiler:

Code:

.code {-moz-border-radius:20px;
background-color:#B9B58E;
padding:10px;
}

.spoiler {-moz-border-radius:20px;
background-color:#B9B58E;
padding:5px;
}

.quote {-moz-border-radius:20px;
background-image:(URL du Image de Fond CODE-préf. taille 200x200px en jpg);
padding:10px;
}

input,textarea, select {
color : code couleur;
font: normal 11px Verdana,Arial,Helvetica,sans-serif;
border-color : code coleur;
border-radius: 9px 9px;
-moz-border-radius: 9px;
}

.forumline{
-moz-border-radius: 20px 20px 20px 20px ;
border-bottom: 6px #5A5947 solid;
}

.forumline{border: 8px #5A5947 solid;}

a:hover{text-transform:uppercase;}

a:hover{font-style:italic;}

.cattitle{font-size: 25px ;}

th.secondarytitle {-moz-border-radius-topleft: 10px; -webkit-border-radius-topleft: 10px;}

table.ipbtable tfoot td {background-color: #f27330;}

.name {font-size : 18px;}

textarea {border: 0px;
border-left: 2px solid #f01dad;
border-right: 2px solid #f01dad;
-moz-border-radius : 5px;
}

a:hover{ background-color:transparent; background-image:url(http://img315.imageshack.us/img315/8362/35co.gif); }

.name a{ border-top: 2px dotted #999900; border-bottom: 2px dotted #999900; }

a { text-decoration: none; }

.row1 a { font-weight:bold; }

div.signature { font-family:Monotype Corsiva;}

.postdetails.poster-profile a img { -moz-border-radius:2px; border: 2px solid #006600; }

blink {
visibility: expression((function(){
if (!window.IEBlink) {
window.IEBlink = "visible";
setInterval(function() {
window.IEBlink = (window.IEBlink=="visible"?"hidden":"visible");
var blinks = document.getElementsByTagName("blink");
for (var i=0; i < blinks.length; i++) { blinks[i].style.visibility=window.IEBlink; }
}, 700)
}
return "";
})());
}

.postdetails.poster-profile a img { background-color: #006600;
-moz-border-radius:10px;
border-top: 5px solid #336666;
border-bottom: 5px solid #336666;
border-left: 5px solid #669900 ;
border-right: 5px solid #669900;
}

a.forumlink { text-shadow: #FFFFFF 2px 2px 2px; }
.row3 a { text-shadow: #FFFFFF 2px 2px 2px; }
.name div span { text-shadow: #FFFFFF 2px 2px 2px;}

#textarea_content iframe, #text_editor_iframe, #text_editor_textarea { border: 8px solid #336666; }

.button2{ -moz-border-radius: 5px;}

EDIT par la guerrière anti-scroll.

Tyli · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 16:21

Merci ,est-ce qu'il est possible de mettre des phrases qui n'apparaissent pas sur le forum et qui donne l'explication du code par exemple "code pour arrondir angles" ?

**ProgVal** · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 16:23

Bonjour,

Code:

[...]

/* ici du texte qui n'apparaitra pas */

[...]

Cordialement,
ProgVal

Tyli · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 16:24

Merci , ça va bien m'aider a y voir plus clair cheers

Tyli · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 19:29

Ca y est , tout est classifié .

Une petite question pour ce code

Code:

/*Arrondi_Citer-------------------------------------------------*/
.quote {
-moz-border-radius-bottomleft:20px;
-moz-border-radius-bottomright:20px;
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
background-image:(URL du Image de Fond CODE-préf. taille 200x200px en jpg);
padding:10px;
}

Qu'est-ce qu'il faut mettre comme URL de fond ? affraid

**Zeco** · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 19:38

L'adresse de l'image de fond que tu souhaites mettre.
Si tu n'en veux pas, retire la partie background-image.

Tyli · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 19:42

On peut mettre n'importe quelle image (unie ) ? et on met l'URL comment ?

Code:

background-image:(URL du Image de Fond CODE-préf. taille 200x200px en jpg);
padding:10px;
}

background-image: url: "URL" ;padding:10px; ? , comment on présente l'url ?

**Final-Blond** · Sujet: Re: Aujourd'hui c'est "grand ménage sur mon forum" 7/2/2010, 20:19

Tyli a écrit:

Code:

/*Arrondi_Citer-------------------------------------------------*/
.quote {
-moz-border-radius-bottomleft:20px;
-moz-border-radius-bottomright:20px;
-moz-border-radius-topleft:20px;
-moz-border-radius-topright:20px;
background-image:(URL du Image de Fond CODE-préf. taille 200x200px en jpg);
padding:10px;
}

Juste une petite précision :
Quand tu mets des arrondis du même radius aux quatre coins, comme l'a suggéré Ze, pas besoin de les mettre en détail, mais en une seule ligne et ajouter plutôt pour que d'autres navigateurs en dehors de Mozilla puissent les voir, donc :

Citation:

/*Arrondi_Citer-------------------------------------------------*/
.quote {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;

Voilà, ce sera valable pour les 4 coins et pour d'autres navs (en dehors de IE et Opera pour les plus connus).

Tyli a écrit:

On peut mettre n'importe quelle image (unie ) ?

Unie ou non, tu peux mettre l'image que tu veux tant que ce n'est que l'adresse (à contrario du HTML ou on peut mettre des précision après les guillemets) et ensuite les précisions par d'autres propriétés comme height et width :

Citation:

{
background-image: url('http://adresse_image.gif'); width: 200px; height: 200px;
padding: 10px;
}