day04 作业

< html lang=“en”>
< head>
< meta charset=“UTF-8”>
< title>Title< /title>
< style>
#container {
width: 640px;
height: 35px;
float: left;
padding: 13px 0px 0px 10px;
}
#i {
width: 98.6px;
height: 33px;
float: left;
padding: 10px 0px 0px 2.4px;
}
#a {
width: 100%;
height: 55px;
padding: 0px 0px 0px 10px;
}
#left-box {
width: 530px;
height: 32px;
border: 1px solid gainsboro;
float: left;
position: relative;
}
#right-box {
width: 100px;
height: 34px;
background-color: #3385ff;
float: left;
text-align: center;
color: #fff;
line-height: 34px;
}
input {
padding: 0;
border: 0;
height: 32px;
width: 470px;
margin-left: 5px;
outline:none ;
}
#pic {
right: 0px;
top: 0px;
position:absolute;
width: 40px;
height: 27px;
}
#b {
font-size: 12px;
padding: 15px 20px 0px 0px;
float: right;
}
#c {
width: 100%;
height: 38px;
background-color: #f8f8f8;
}
#d {
padding: 5px 0px 0px 120px;
float: left;
text-align: center;
}
.e{
width: 54px;
height: 36px;
padding: 0px 0px 0px 20px;
font-size: 15px;
text-decoration:none;
color: gray;

    }
    #e {
        font-size: 12px;
        color: gainsboro;
        width: 538px;
        height: 28px;
        margin:9px 0px 0px 121px;
    }
    #f {
        width: 100%;
        height: 1757px;
        margin:9px 0px 0px 121px;
    }
    #g {
        width: 550px;
        height: 1757px;

    }
    #h {
        width: 360px;
        height: 962px;
        float: right;
        border-left:1px solid gainsboro;
        margin-top: -1760px;
        margin-right: 384px;

    }

</style>

< /head>
< body style=“margin: 0 auto”>
< div id=“a”>
< img src=“http:www.baidu.com/img/baidu_resultlogo@2.png” id=“i”/>
< div id=“container”>
< div id=“left-box”>
< input type=“text” value=“百度”>
< img src=“a3.png” id=“pic"alt=”" style=“margin-top: 3px;”>
< /div>
< div id=“right-box”>
百度一下
< /div>
< /div>
< div id=“b”>
< a href="">百度首页< /a> 
< a href="">设置< /a>▼   
< a href="">登录< /a> 
< /div>
< div style=“clear: both”>< /div>
</ div>
< div id=“c”>
< div id=“d” >< a href="">< /a>
< a href="" class=“e”
style=“border-bottom: 2px solid blue;
padding-bottom:11px;
font-weight: 700;
padding-left: 1px;
color: black;”>网页
< a href="" class=“e”>资讯< /a>
< a href="" class=“e”>视频</ a>
< a href="" class=“e”>图片< /a>
< a href="" class=“e”>知道< /a>
< a href="" class=“e”>文库< /a>
< a href="" class=“e”>贴吧< /a>
< a href="" class=“e”>采购< /a>
< a href="" class=“e”>地图< /a>
< a href="" class=“e”>更多»< /a>
< /div>
< div style=“clear: both”>< /div>
< /div>
< div id=“e”>
< span>百度为您找到相关结果约100,000,000个< /span>
< div style=“float: right;”>
< a href="" style=“text-decoration:none;”>
< img src=“b.jpg” width=“14” height=“14” style=“position:relative;top:3px;”>
< span style=“color: black”>搜索工具< /span>
< /a>
</ div>
< div style=“clear: both”>< /div>
< /div>
< div id=“f”>
< div id=“g”>
< div>
< a href="" style=“float: left”>< span style=“color: red”>百度< /span>< span style=“color: blue”>一下< /span>
< span>,</ span> < span style=“color: blue”>你就知道< /span>< /a>
< div style=“float: left;width: 33px;height: 17px;
background-color: #3385ff;color: white;font-size: 13px;
margin-left: 10px;margin-top: 2px”> 官网< /div>
< div style=“clear: both;”>< /div>
< div>
< img src=“http:www.baidu.com/img/baidu_resultlogo@2.png” width=“130px”
height=“40px” style=" padding: 20px 0px 0px 2.4px;float: left">
< div style=“font-size: 13px;padding-left: 150px;padding-top: 5px;”>
全球最大的中文搜索引擎、致力于让网民更便捷地获取信息
，找到所求。
< span style=“color: red”>百度< /span>
超过千亿的中文网页数据库，可以瞬间找到相关的搜索结果。< /div>
< a href=“https://www.baidu.com/ " style=“font-size: 13px;
padding-left: 20px;color: green;float: left;text-decoration:none;”> https://www.baidu.com/ < /a>
< a href=”" style=“color: green;font-size:5px;text-decoration:none;”>  ▼< /a>
< a href="" style=“font-weight: 700;color: orange;text-decoration:none;”>V₃< /a>
< span>-< /span>
< a href="" style=“font-size: 13px;color: gray”>百度快照< /a>
< span>-< /span>
< a href="" style=“font-size: 13px;color: gray”>7616条评论< /a>
< /div>
< /div>

    <div style="padding-top: 20px">
        <a href="" style="float: left"><span style="color: red">百度</span><span style="color: blue"> </span>
            <span style="color: red">百度</span><span style="color: blue">百科</span></a>
        <div style="clear: both;"></div>
        <div>
            <img src="http:www.baidu.com/img/baidu_resultlogo@2.png" width="130px"
                 height="40px" style=" padding: 20px 0px 0px 2.4px;float: left">
            <div style="font-size: 13px;padding-left: 150px;padding-top: 5px;">
                <span style="color: red">百度</span>
                （纳斯达克：BIDU），全球最大的中文搜索引擎、最大的中文网站。。
                <span style="color: red">百度</span>
                愿景是：成为最懂用户，并能帮助人们成长的全球顶级高科技公司。“
                <span style="color: red">百度</span>
                ”二字，来自于八百年前南宋词人...</div>
            <a href="" style="font-size: 13px; margin-left:20px;color: blue ">发展简史</a>
            <a href="" style="font-size: 13px;color: blue">公司理念</a>
            <a href="" style="font-size: 13px;color: blue">财报数据</a>
            <a href="" style="font-size: 13px;color: blue">产品手册</a>
            <a href="" style="font-size: 13px;color: blue">多语言化</a>
            <a href="" style="font-size: 13px;color: blue"> 更多>></a>
            <div style=" border-left:2px solid #3385ff;
            font-size: 14px;margin-left: 150px;">
                <p style="padding-left:10px; ">关注点：
                    <a href="" style="font-size: 13px;color: blue">2019百度AI开发者大会</a></p>

            </div>
            <a href="baike.baidu.com/ " style="font-size: 13px;
             padding-left: 150px;color: green;
             float: left;text-decoration:none;"> baike.baidu.com/  </a>
            <a href="" style="color: green;font-size:5px;text-decoration:none;">&nbsp;&nbsp;▼</a>
        </div>
    </div>

</div>
<div id="h">
    <div style="font-weight: 700;font-size: 13px;margin-left: 20px;">百度高管
        <a href=""style="float: right;font-weight:700;color:blue;
            text-decoration:none;">&nbsp;V</a>
        <a href=""style="float: right;font-weight:500;color: blue">展开</a>
        </div>

        <div style="float: left">
            <img src="c.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
        </div>
        <div style="float: left">
            <img src="d.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
        </div>
        <div style="float: left">
            <img src="f.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
        </div>
        <div>
            <img src="e.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
        </div>
        <div><a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 30px;color: blue;">李彦宏</a>
            <a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 50px;color: blue;">余正钧</a>
            <a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 50px;color: blue;">王海峰</a>
            <a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 50px;color: blue;">沈抖</a>
        </div>
        <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 20px;float: left;color: gray;">
            百度创始人董事长CEO</div>
        <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 20px;float: left;color: gray;">
            百度集团首席财务官</div>
        <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 21px;float: left;color: gray;">
            百度总裁</div>
        <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 19px;float: left;color: gray;">
            百度集团首席技术官</div>

    <div style="font-weight: 700;font-size: 13px;margin-left: 20px;">百度高管
        <a href=""style="float: right;font-weight:700;color:blue;
            text-decoration:none;">&nbsp;V</a>
        <a href=""style="float: right;font-weight:500;color:blue; ">展开</a>
    </div>

    <div style="float: left">
        <img src="2.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
    </div>
    <div style="float: left">
        <img src="1.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
    </div>
    <div style="float: left">
        <img src="3.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
    </div>
    <div>
        <img src="5.jpg" width="70px" height="70px"style="margin-top: 10px;
            margin-left: 20px;">
    </div>
    <div><a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 30px;color: blue;">百度搜索</a>
        <a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 35px;color: blue;">百度APP</a>
        <a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 35px;color: blue;">百度糯米</a>
        <a href="" style="font-size: 13px;margin-top: 10px;
            margin-left: 35px;color: blue;">百度地图</a>
    </div>
    <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 22px;float: left;color: gray;">
        全球最大中文搜索引擎</div>
    <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 20px;float: left;color: gray;">
        有事搜一搜没事看一看</div>
    <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 20px;float: left;color: gray;">
        本地精品生活指南</div>
    <div style="width: 70px;height: 50px;font-size: 12px;
            margin-top: 10px;
            margin-left: 18px;float: left;color: gray;">
        亿万人在用的专业地图</div>
    <div>
    </div>
    
</div>

< /div>
< /body>
< /html>