php实战第二十天_PHP教程

WBOY
Freigeben: 2016-07-14 10:11:31
Original
820 Leute haben es durchsucht

严格来说这几天实战得是 div+css和ps的修炼中.


 

 


css来来去去也都是那几个属性.


[css]
@charset "utf-8"; 
/* CSS Document  
*{ 
    margin:0px; 
    padding:0px; 
    font-size:14px; 
    } 
body{ 
        background-color:#ECECEC; 
    } 
 
#head{ 
    position:fixed; 
    top:0px; 
     
    background:#FAFAFA; 
     
    width:100%; 
    height:54px; 
     
    border-bottom: 1px solid #E8E8E8; 
    box-shadow: 0 1px 5px rgba(34, 25, 25, 0.2); 
    z-index:100; 
     

 
#header{ 
    margin:0 auto; 
 
    width:960px; 
    height:54px; 
    } 
.nav{ 
    float: left; 
    height: 54px; 
    width: auto; 
    } 
     
.nav ul ,.nav li{ 
    float: left; 
    list-style: none outside none; 

 
.nav li a{ 
    padding: 0 15px; 
     
    color: #585858; 
    display: block; 
    line-height: 54px; 
     
    border-right: 1px solid #E8E8E8; 

 
 
#main{ 
 
    position:relative; 
    top:82px; 
     
    margin:0 auto; 
 
    width:960px; 
    height: auto; 
    } 
 
#left{ 
    float: left; 
 
    background: none repeat scroll 0 0 #FFFFFF; 
    border: 1px solid #C7C7C7; 
    width: 630px; 
 
    

 
#right{ 
    float:right; 
 
    //background: none repeat scroll 0 0 #FFFFFF; 
   // border: 1px solid #C7C7C7; 
    width: 314px; 
 
     

 
 
 
#footer{ 
    float: left; 
 
    margin-top:90px; 
 
    border-top: solid 1px #ccc; 
 
    width: 100%; 
 
 

 
#f_center{ 
    width: 960px; 
    height: 54px; 
    margin: 0 auto; 
 
    text-align: center; 
 

 
#f_top{ 
 
    width:700px; 
    margin: 0 auto; 
    margin-top: 10px; 

 
#f_top ul{ 
    list-style: none; 

 
#f_top li{ 
    float: left; 
    padding: 10px; 
    border-right: solid 1px #ccc; 

 
#f_bottom{ 
    float: left; 
    text-align: center; 
    width: 960px; 
 

 
.left_kuai{ 
    padding-left: 10px; 
    padding-bottom:10px; 

 
.left_kuai_t{ 
    background-image:url("../img/item_left.png"); 
    width: 412px; 
    height:65px; 
 
    margin-top:20px; 
    margin-left: -19px; 
 
    color: #FFFFFF; 
    font-weight: 700; 
    height: 65px; 
    line-height: 55px; 
 
    text-indent: 2em; 

 
.right_kuai{ 
    margin-top:0px; 
    margin-bottom: 20px; 
    width:100%; 
    border: solid 1px #ccc; 
    background-color: #fff; 
 
    padding-left: 10px; 
    padding-bottom:10px; 
 

 
.right_kuai_t{ 
    background-image:url("../img/item_right.png"); 
    width: 166px; 
    height: 30px; 
 
    margin-top:-12px; 
    margin-left:20px; 
 
    color: #FFFFFF; 
    font-size: 15px; 
    font-weight: 700; 
    line-height: 30px; 
 
    text-indent: 1em; 
 

@charset "utf-8";
/* CSS Document  微凉 QQ:496928838 http://wl.125.la*/
*{
 margin:0px;
 padding:0px;
 font-size:14px;
 }
body{
  background-color:#ECECEC;
 }

#head{
 position:fixed;
 top:0px;
 
 background:#FAFAFA;
 
 width:100%;
 height:54px;
 
 border-bottom: 1px solid #E8E8E8;
 box-shadow: 0 1px 5px rgba(34, 25, 25, 0.2);
 z-index:100;
 
}

#header{
 margin:0 auto;

 width:960px;
 height:54px;
 }
.nav{
 float: left;
    height: 54px;
    width: auto;
 }
 
.nav ul ,.nav li{
 float: left;
    list-style: none outside none;
}

.nav li a{
    padding: 0 15px;
   
    color: #585858;
    display: block;
    line-height: 54px;
 
 border-right: 1px solid #E8E8E8;
}


#main{

 position:relative;
 top:82px;
 
 margin:0 auto;

 width:960px;
 height: auto;
 }

#left{
 float: left;

 background: none repeat scroll 0 0 #FFFFFF;
    border: 1px solid #C7C7C7;
    width: 630px;

  
}

#right{
 float:right;

 //background: none repeat scroll 0 0 #FFFFFF;
   // border: 1px solid #C7C7C7;
    width: 314px;

   
}

 

#footer{
 float: left;

 margin-top:90px;

 border-top: solid 1px #ccc;

 width: 100%;


}

#f_center{
 width: 960px;
 height: 54px;
 margin: 0 auto;

 text-align: center;

}

#f_top{

 width:700px;
 margin: 0 auto;
 margin-top: 10px;
}

#f_top ul{
 list-style: none;
}

#f_top li{
 float: left;
 padding: 10px;
 border-right: solid 1px #ccc;
}

#f_bottom{
 float: left;
 text-align: center;
 width: 960px;

}

.left_kuai{
 padding-left: 10px;
 padding-bottom:10px;
}

.left_kuai_t{
 background-image:url("../img/item_left.png");
 width: 412px;
 height:65px;

 margin-top:20px;
 margin-left: -19px;

 color: #FFFFFF;
    font-weight: 700;
    height: 65px;
    line-height: 55px;

    text-indent: 2em;
}

.right_kuai{
 margin-top:0px;
 margin-bottom: 20px;
 width:100%;
 border: solid 1px #ccc;
 background-color: #fff;

 padding-left: 10px;
 padding-bottom:10px;

}

.right_kuai_t{
 background-image:url("../img/item_right.png");
 width: 166px;
 height: 30px;

 margin-top:-12px;
 margin-left:20px;

    color: #FFFFFF;
    font-size: 15px;
    font-weight: 700;
    line-height: 30px;

    text-indent: 1em;

}

 

www.bkjia.comtruehttp://www.bkjia.com/PHPjc/477330.htmlTechArticle严格来说这几天实战得是 div+css和ps的修炼中. css来来去去也都是那几个属性. [css] @charset utf-8; /* CSS Document *{ margin:0px; padding:0px; font-size:14p...
Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage