php实战第二十天

发布时间：2015-05-27 19:26:43作者：知识屋

严格来说这几天实战得是 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;