VIP28/day6/demo.css

* {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    box-sizing: border-box;
}
#header {
    width: 100%;
    height: 35px;
    background: #00f;
}
#header .contain {
    width: 1089px;
    height: 100%;
    background: #f00;
    margin: 0 auto;
    overflow: hidden;
}
#header .contain .login {
    width: 230px;
    height: 100%;
    background: #ff0;
    float: left;
}
#header .contain .list {
    width: 230px;
    height: 100%;
    background: #0f0;
    float: right;
}
/* 上半部分 */
#main .shop-top .part-one {
    width: 100%;
    height: 201px;
}
#main .shop-top .part-one .container {
    width: 1089px;
    height: 100%;
    margin: 0 auto;
}
#main .shop-top .part-one .container .container-top {
    width: 100%;
    height: 115px;
    background: #00f;
    overflow: hidden;
}
/* logo盒子 */
#main .shop-top .part-one .container .container-top .logo {
    width: 176px;
    height: 49px;
    float: left;
}
#main .shop-top .part-one .container .container-top .logo img {
    width: 100%;
    height: 100%;
    margin: 25px;
}
/* 搜索盒子 */
#main .shop-top .part-one .container .container-top .search {
    width: 536px;
    height: 100%;
    margin-left: 123px;
    background: #f00;
    float: left;
}
/* 购物车 */
#main .shop-top .part-one .container .container-top .car {
    width: 90px;
    height: 100%;
    margin-left: 52px;
    background: #ff0;
    float: left;
}
#main .shop-top .part-one .container .container-bottom {
    width: 100%;
    height: 86px;
    background: #0ff;
} 
/* 第二部分 */
#main .shop-top .part-two {
    width: 100%;
    height: 576px;
    background: url("./images/banner.png") no-repeat;
}
#main .shop-top .part-two .dialogList {
    width: 260px;
    height: 546px;
    background: rgba(0, 0, 0, .3);
    color: #fff;
    margin-left: 415px;
}
/* 第三部分 */
#main .shop-top .part-three {
    width: 1200px;
    height: 376px;
    background: #f00;
    margin: 0 auto;
    overflow: hidden;
}
#main .shop-top .part-three .list-one {
    width: 590px;
    height: 316px;
    background: #ff0;
    float: left;
    margin-top: 36px;
}
#main .shop-top .part-three .list-top {
    width: 100%;
    height: 35px;
    background: purple;
}
#main .shop-top .part-three .list-bottom {
    width: 100%;
    height: 254px;
    margin-top: 27px;
    background: #0f0;
}
#main .shop-top .part-three .list-two {
    width: 590px;
    height: 316px;
    background: #ff0;
    float: left;
    margin-top: 36px;
    margin-left: 20px;
}
/* 下半部分 */
#main .shop-bottom {
    width: 100%;
    height: 100%;
    background: #eee;
}
#main .shop-bottom .part-four {
    width: 1200px;
    height: 554px;
    background: #ff0;
    margin: 0 auto;
}
#main .shop-bottom .part-five {
    width: 1200px;
    height: 554px;
    background: #f00;
    margin: 0 auto;
}
#main .shop-bottom .part-six {
    width: 1200px;
    height: 554px;
    background: #0ff;
    margin: 0 auto;
}
.titleMain {
    width: 100%;
    height: 77px;
    background: #00f;
}
.shopMain {
    width: 100%;
    height: 477px;
    background: #0f0;
}
#main .shop-bottom .part-seven {
    width: 1200px;
    height: 99px;
    margin: 0 auto;
}
#main .shop-bottom .part-seven  img {
    width: 129px;
    height: 36px;
    display: block;
    margin: 30px auto 0;
}
/* 页尾 */
#footer {
    width: 1200px;
    height: 377px;
    background: #f00;
    margin: 0 auto;
}