百度前端技术学院-task1.3源代码

因为其中有图片，所以就给有图片的位置加了边框和设置了大小，这样哪怕图片不显示也可以知道在哪里。

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
        <title>Task1-3</title>
        <link rel="shortcut icon" href="/sjq_ico.png" />
    <style type="text/css">
        html,body,div{margin:0;padding: 0px; }
        #main_page{border: solid 1px #999;background-color: #eee;overflow: auto; zoom:1;position: relative;margin: 20px;padding: 20px 0px 20px 20px;}
        #main{width:100%; float:left;}
        #main #body{margin:0px 160px 0px 220px; border: solid 1px #999;background-color: #fff;}
        #left{width:200px; float:left; margin-left:-100%;background-color: #fff;border: solid 1px #999;}
        #right{margin-left:-140px;float:left;width: 120px; border: solid 1px #999;background-color: #fff;}
        #body .team_de{ padding: 20px;}
        .image3{ padding: 20px 20px 0 20px;}
        .image3 img {margin-bottom: 20px;}
        .left_image{float: left;margin: 0px 20px 20px 20px;}
        .left_text{ float: left;}
        .left_1{padding-right: 20px;}
        img{display:block;border: solid 1px #999;width: 80px;height: 80px;}
    </style>
</head>
<body>
    <div id="main_page">
        <div id="main">
            <div id="body">
                <div class="team_de">
                    <h1>团队简介<h1>
                    <h2>队名:<em>小明</em></h2>
                    <p>刚开始只是想随便起一个名字用下，因为起名字真是一个很累的技术活。比如要好听啊，潮啊，能体现个性啊等等，所以就先用队友的小名：小明好了。队员人数达标之后，我一激动，就点击了创建团队......当我发现队名不能更改的时候，我的内心是无比的悲痛的，这名字太俗了吧...
                    </p>
                    <h2>队友</h2>
                    <p>因为我太想参加百度前端技术学院了，但是人数又不够，所以就拉了两个人，嘿嘿...一个是我师弟，一个是我的好友.在此感谢他们的加盟 </p>
                    <i>we are coming!</i>
                </div>
            </div>
        </div>
        <div id="left">
            <div class="left_1">
                <div class="left_image"><img src="img/lena.png" alt="team logo"/></div>
                <div class-"left_text"><p>we are the best! Go! Go! </p></div>
            </div>
        </div>
        <div id="right">
            <div class="image3">
                <img src="img/parrot.png" alt="team logo"/>
                <img src="img/camera.png" alt="team logo"/>
                <img src=" " alt="team logo"/>
            </div>
        </div>
    </div>
</body>
</html>

 

posted @ 2016-03-23 14:19  huansky  阅读(466)  评论(0)  编辑  收藏  举报