DesignFusion : Le blog de test !!!

DesignFusion : Le blog de test !!!

Comment se servir de ce nouveau mode.

1 : Passez en rapidDesign.

2 : activez le css perso et mettez ce code :        

  • {margin: 0; padding: 0;} 
    body 

    background : #FFFFFF; 
    background-image : url(http://); 
    background-repeat:repeat;
    background-attachment:fixed;
    font-size : 10pt; 
    font-family : Arial; 
    text-align : center;
    color:#000000;

    #cadre 

    position: relative;
    background : #FFEFBD; 
    background-image : url(http://); 
    background-repeat:repeat;
    background-attachment:fixed;
    width : 968px; 
    padding-top : 5px; 
    padding-left : 5px; 
    padding-right : 5px; 
    padding-bottom : 5px; 
    text-align : left; 
    margin : auto; 
    border : 1px solid #000000; 

    #haut 
    {
    background : #FFEFBB; 
    background-image : url(http://);
    background-repeat:repeat;
    background-attachment:fixed;
    height : 70px; 
    border-width : 1px; 
    border-style : solid; 
    border-color : #000000; 
    text-align:center;
    padding-top:5px;
    }
    #haut h1 a
    {
    text-decoration:none;
    font-size : 18pt; 
    font-family : Comic sans Ms; 



    color : #000000; 
    text-decoration : underline; 

    a:hover 

    color : #000000; 
    text-decoration : none; 

    #barre 

    width : 768px; 
    margin-top : 5px; 
    height:30px;

    #barre ul 

    list-style-type : none; 

    #barre li 

    float : left; 

    #barre a 

    background : #004000; 
    color : #EEF4E2; 
    text-decoration : none; 
    width : 100px; 
    height : 23px; 
    margin-left : 2px; 
    border-width : 1px; 
    border-style : solid; 
    border-color : #000000; 
    text-align : center; 
    display : block; 

    #barre a:hover 

    background : #C5D5A7; 
    border : 1px solid #004000; 

    #menu 
    {
    width : 170px; 
    float:left;

    #menu ul 

    list-style-type : none; 

    #menu ul li 

    background : #EBEDAB; 
    width : 170px; 
    margin-top : -1px; 
    border-width : 1px; 
    border-style : solid; 
    border-color : #000000; 

    #menu ul li a 

    width : 170px; 
    line-height : 25px;
    color:#003366;
    background : #EBEDAB; 
    font-size : 10pt; 
    font-family : Arial; 

    #menu ul li a:hover 

    text-decoration : none; 
    color:#006699;
    background : #FFFFFF; 

    #menu h2 

    background : #004000; 
    color : #EEF5FA; 
    width : 170px; 
    height : 25px; 
    font-size : 15px; 
    border-width : 1px; 
    border-style : solid; 
    border-color : #000000; 
    text-align : center; 

    #contenu 

    width : 730px; 
    padding-top : 5px; 
    padding-left : 5px; 
    padding-right : 5px; 
    padding-bottom : 5px; 
    margin-top : 5px; 
    margin-left : 200px;
    font-size : 10pt; 
    font-family : Verdana; 
    color:#336699;
    background : #FFEFBD; 

    #contenu h3 

    background : #000000; 
    color : #E8EEF4; 
    width : 457px; 
    height : 25px; 
    padding-left : 15px; 
    padding-right : 50px; 
    margin-top : 10px; 
    margin-left : 10px; 
    margin-right : 10px; 
    margin-bottom : 15px; 
    font-size : 15px; 
    font-family : Trebuchet MS; 

    #contenu ul 

    list-style-type : square; 
    margin-left : 15px; 
    }
    #contenu a 

    color : #003366; 
    text-decoration : underline; 
    background : #FFEFBD;
    font-size : 10pt; 
    font-family : Arial; 

    #contenu a:hover 

    color : #000400; 
    text-decoration : none;
    background : #FFFFFF; 

    #bas 

    background : #EBEDAB; 
    margin : auto;

    #spacer 

    height : 1px; 
    clear : both; 

    fieldset {border:0;}
    hr {margin:10px;}
    * html #menu h2{width: 172px;}
    #contenu ol {
    list-style-type: decimal;
    margin-left:25px;
    }  

 

3 : Vous verrez les changements dès l'application du nouveau design.

4 : L'image d'en tête est trop grande. Pour y remédier, voici 2 soluces :

Soit mettre une iimage carée. Soit bidouiller le css.

5 : Fini !


03/05/2021
0 Poster un commentaire