美文网首页
作业暂时day03

作业暂时day03

作者: 8eb783a6b522 | 来源:发表于2017-07-01 18:16 被阅读0次

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
* {
margin: 0;
padding: 0;
}

    body {
        color: #333;
    }

    body a {
        color: #333;
    }

    a {
        text-decoration: none
    }

    /*设置toptpop背景及宽度*/
    .toptop {
        background: #19bebe;
        height: 50px;
    }

    /*设置toptop内图片的位置*/
    .im {
        height: 50px;
        margin-right: auto;
        margin-left: auto;
        display: block;

    }

    /*设置整个top位置背景及高度*/
    .top {
        background-color: #f0f0f0;
    }

    /*设置左边start元素*/
    .start {
        float: left;
        font-size: 12px;
    }

    /*设置中间container*/
    .container {
        text-align: center;
        line-height: 40px;
        width: 1000px;
        font-size: 20px;
        margin-left: 400px;
    }

    /*设置top模块end元素的参数*/
    .end {
        float: right;
        font-size: 12px;
    }

    /*设置container元素内四个a标签的位置*/
    .container a {
        margin-right: 60px;
        text-decoration: none;
        font-size: 20px;
        color: #333;
    }

    /*设置start模块内icon元素的参数*/
    .start > .icon {
        display: block;
        width: 19px;
        height: 19px;
        background: url(img/location.png);
        position: absolute;
        top: 50%;
        margin-top: -10px;

    }

    .start > .first {
        margin-left: 30px;
    }

    .start, .end {
        position: relative
    }

    /*设置end模块内icon元的参数*/
    .end > .icon {
        top: 50%;
        margin-top: -10px;
        margin-left: -30px;
        position: absolute;
        width: 20px;
        height: 20px;
        background: url(img/adm.png);
    }

    .content {
        margin-left: auto;
        margin-right: auto;
        width: 1000px;
        margin-top: 20px;
    }

    .icon {
        font-size: 18px;
    }

    .head {
        width: 1000px;
        background-color: #ebebeb;
    }

    .head ul {
        overflow: hidden;
        list-style: none
    }

    .head li {
        float: left;
        margin: 10px;
    }

    .head li a {
        border: 1px solid transparent;
        padding: 3px;
    }

    .head li a:hover {
        background-color: #fff;
        border: 1px solid #ffa700
    }

    ul li span.index {
        display: block;
        width: 20px;
        height: 20px;
        margin-left: -10px;
        background: #ebebeb url(img/indexSelect.png) no-repeat center center;
    }

    .searchWrap {
        width: 1000px;
        height: 60px;
        line-height: 60px;;
        margin-left: auto;
        margin-right: auto;
        display: block;
        background-color: #f0f0f0;
        margin-top: 20px;
    }

    .searchStart {
        float: left;
        font-size: 5px;
        position: relative;
        overflow: hidden;
    }

    .searchStart li {
        float: left;
        margin-right: 8px;
        list-style: none;
    }

    .searchEnd {
        float: right;
        position: absolute;
        margin-left: 800px;
    }

    .searchContent {
        position: absolute;
        margin-left: 400px;
    }

    /*searchContnet设置结束*/

    /*设置parent八个模块图片框*/
    .parent {
        font-size: 14px;
        width: 1000px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto
    }

    .parent > div {
        width: 238px;
        border: 1px solid #dedede;
        height: 344px;
        float: left
    }
    .searchEnd a{color:#f7cd91;}
    .parent>div.child{color:#f7cd91;}
    .parent > .child {
        margin-right: 13px;
    }

    .parent > .two {
        margin-right: 14px;
    }

    .parent {
        width: 1000px;
        overflow: hidden;
        margin-top: 50px;
    }

    .parent > div {
        width: 238px;
        border: 1px solid #dedede;
        height: 344px;
        float: left;
        background: #dedede;
        overflow: hidden;
        text-align: center;
    }

    .parent span.huanbao {
        font-weight: bold;
        font-size: 16px;
    }

    .parent > .child {
        margin-right: 13px;
    }

    .parent > .two {
        margin-right: 14px;
    }

    .parent ul.wrapOne {
        text-align: left !important;
        text-indent: 10px;;
    }

    img.pic {
        margin-top: 20px;

    }

    .parentOne {
        font-size: 14px;
        width: 1000px;
        overflow: hidden;
        margin-left: auto;
        margin-right: auto
    }

    .parentOne > div {
        width: 238px;
        border: 1px solid #dedede;
        height: 344px;
        float: left
    }

    .parentOne > .child {
        margin-right: 13px
    }

    .parentOne > .two {
        margin-right: 14px;
    }

    .parentOne {
        width: 1000px;
        overflow: hidden;
        margin-top: 50px;
    }

    .parentOne > div {
        width: 238px;
        border: 1px solid #dedede;
        height: 344px;
        float: left;
        background: #dedede;
        overflow: hidden;
        text-align: center;
    }

    .parentOne span.huanbao {
        font-weight: bold;
        font-size: 16px;
    }

    .parentOne > .child {
        margin-right: 13px;
    }

    .parentOne > .two {
        margin-right: 14px;
    }

    .parentOne ul.wrapOne {
        text-align: left !important;
        text-indent: 10px;;
    }

    /*设八个图片框结束*/
    /*设置尾部结束界面*/
    .footer_end{
        text-align: center;
        margin-right: auto;
        margin-left: auto;
        width: 1000px;
        height:30px
    }
    .down {
        height: 30px;
        background: white;
        margin-top: 20px;
        list-style: none;
        overflow: hidden;
        font-size: 5px;
        position: relative;
        line-height: 10px;
    }

    .down_one {
        float: left;
        margin-left: 100px;
        position: absolute;
    }

    .down_three {
        float: right;
        margin-right: 300px;
        margin-top: -15px;
        background-color:#f7cd91;
    }
    .last{overflow: hidden;
        height:80px;
        width: 500px;
        position: relative}
    .last_one{float: left;
        position: absolute}

</style>

</head>
<body>
<div class="toptop">



</div>
<div class="top">

<div class="container">

    <div class="start">
        <i class="icon"></i>
        <span class="text first">深圳</span>
        <span class="text">切换</span>
    </div>

    <a href="#">首页</a>
    <a href="#">资讯</a>
    <a href="#">测评</a>
    <a href="#">商城</a>

    <div class="end">
        <span class="icon"></span>
        <span>个人中心</span>
    </div>
</div>

</div>


<div class="content">
<span class="icon">首页> 预防装修材料 >材料库</span>

<div class="head">
    <ul>
        <li><a href="#">类别</a></li>
        <li><a href="#">全部</a></li>
        <li><a href="#">地板</a></li>
        <li><a href="#">涂料</a></li>
        <li><a href="#">墙纸</a></li>
        <li><a href="#">瓷砖</a></li>
        <li><a href="#">粘胶剂</a></li>
        <li><a href="#">油漆</a></li>
        <li><a href="#">家具</a></li>
        <li><a href="#">板材</a></li>
        <li><a href="#">饰品</a></li>
        <li><span class="index"></span></li>
    </ul>
    <ul>
        <li><a href="#">类型</a></li>
        <li><a href="#">全部</a></li>
    </ul>
    <ul>
        <li><a href="#">材质</a></li>
        <li><a href="#">全部</a></li>
        <li><a href="#">实木</a></li>
        <li><a href="#">复合</a></li>
        <li><a href="#">强化</a></li>
        <li><a href="#">其他</a></li>
    </ul>
    <ul>
        <li><a href="#">品牌</a></li>
        <li><a href="#">全部</a></li>
        <li><a href="#">圣象</a></li>
        <li><a href="#">大自然</a></li>
        <li><a href="#">生活家</a></li>
        <li><a href="#">北美枫情</a></li>
        <li><a href="#">德尔</a></li>
        <li><a href="#">博典</a></li>
        <li><a href="#">船王</a></li>
    </ul>
</div>
<!--startSearch-->
<div class="searchWrap">
    <ul class="searchStart">
        <li><a href="#">发布时间</a><span></span></li>
        <li><a href="#">价格</a><span></span></li>
        <li><a href="#">环保节能</a><span></span></li>
    </ul>

    <div class="searchContent">
        <input type="text" placeholder="搜索"/>
        <a></a>

        <span></span>
    </div>

    <div class="searchEnd">
        <span></span>
        <a href="#">了解家居医生建材环保</a>
    </div>

</div>
<!-- endSearch-->

</div>


<div class="parent">
<div class="child">
<div class="part_one">



<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span class="huanbao">环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>
<div class="child">
<div>



<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>

<li><span>环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>
<div class="two">
<div>



<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span>环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>
<div>
<div>

<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span class="huanbao">环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>

</div>
<div class="parentOne">
<div class="child">
<div class="part_one">



<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span class="huanbao">环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>
<div class="child">
<div>



<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span>环保评级：B (可以使用)</span></li>

</ul>
</div>
</div>
<div class="two">
<div>



<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span>环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>
<div>
<div>

<ul class="wrapOne">
<li> 德尔 都市系列3001</li>
<li>木地板 复合地板</li>
<li> 单价：128元/㎡</li>
<li><span class="huanbao">环保评级：B (可以使用)</span></li>
</ul>
</div>
</div>

</div>
<div class="footer_end">
<ul class="down">
<li class="down_one">
<a href="#">上一页</a>
<a href="#">1</a>
<a href="#">2</a>
<a href="#">3</a>
<a href="#">4</a>
<a href="#">5</a>
<a href="#">下一页</a>
</li>
<li class="down_two"><a href="#">共有十页 去第</a>
<input class="sex" type="text"/>
<a href="#">页</a>
</li>
<li class="down_three"><a href="#">确定</a></li>

</ul>

</div>
<div class="last">
<div class="last_one">
![](img/small_weixin.png alt=)
</div>
<div class="last_two">
<p>建材检测 需求反馈</p>
<p>亲爱的用户，我们正在不断的完善和更新建材库</p>
<p>若没有找到你想要的材料信息，请将你想要的建材信息告诉我们。</p>
</div>
</div>

</body>
</html>

相关文章

  • 作业暂时day03

    * {margin: 0;padding: 0;} 首页> 预防装修材料...

  • 八斗大数据第十一期 百度网盘分享

    【day01】开学典礼 【day02】MapReduce 【day03】Hive 【day04】hive作业+hi...

  • 八斗大数据第十一期 百度网盘分享

    【day01】开学典礼 【day02】MapReduce 【day03】Hive 【day04】hive作业+hi...

  • Day03作业

    day3作业:1.下列四组数，依次为二进制、八进制和十六进制，符合要求的是（d）a. 12, 77, 10b....

  • Day03作业

  • Day03 - 作业

    作业：HAproxy配置文件操作 一、作业要求 根据用户输入输出对应的backend下的server信息 可添加b...

  • day03作业

    1.n1=6789,写代码获取变量n中百位上的数 2.n2=12345,写代码获取变量n中每一位上的数 3.写出判...

  • day03 作业

    下面定义变量正确的是(ad)a. a = b = c = 10b. a,c = 10c. in = 20d. nu...

  • 暂时完成作业

    经历了几个晚上的熬夜，终于把图赶出来打印完，中午可以睡个午觉。准备到区庆，放2天假，有点小激动。接下来还有好...

  • 自律给我自由—Day003

    【叶子姑娘的自律100天挑战 Day03】 2019.01.16 Day03/100 【早起】继续保持在7点左右起...

网友评论

      本文标题：作业暂时day03

      本文链接：https://www.haomeiwen.com/subject/iqrgcxtx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|作业暂时day03|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！