html/task3.html at master · cs-sky/html · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="task3.css" type="text/css"/>
</head>
<body>
<div id="out" cols="220px,*,100px">
    <div id="left">
        <img src="img/task1.png" width="80px" height="80px"/>
        <p>百度</p>

    </div>
    <div id="right">
        <img src="img/task1.png" width="80px" height="80px"/>
        <img src="img/task1.png" width="80px" height="80px"/>
        <img src="img/task1.png" width="80px" height="80px"/>
        <img src="img/task1.png" width="80px" height="80px"/>

    </div>
    <div id="mid">
        <div class="article">
            <h2>沁园春·雪</h2>
            <p class="line">北国风光，千里冰封，万里雪飘。</p>
            <p class="line">望长城内外，惟余莽莽；大河上下，顿失滔滔。</p>
            <p class="line">山舞银蛇，原驰蜡象，欲与天公试比高。</p>
            <p class="line">须晴日，看红装素裹，分外妖娆。</p>
            <p class="line">江山如此多娇，引无数英雄竞折腰。</p>
            <p class="line">惜秦皇汉武，略输文采；唐宗宋祖，稍逊风骚。</p>
            <p class="line">一代天骄，成吉思汗，只识弯弓射大雕。</p>
            <p class="line">俱往矣，数风流人物，还看今朝。</p>
        </div>

    </div>

</div>


<div class="container-position">
    <div class="left">
        <div class="team-logo"><img src="test.jpg" /></div>
        <p class="team-name">position布局</p>
    </div>

    <div class="mid">
        <div class="article">
            <h2>沁园春·雪</h2>
            <p class="line">北国风光，千里冰封，万里雪飘。</p>
            <p class="line">望长城内外，惟余莽莽；大河上下，顿失滔滔。</p>
            <p class="line">山舞银蛇，原驰蜡象，欲与天公试比高。</p>
            <p class="line">须晴日，看红装素裹，分外妖娆。</p>
            <p class="line">江山如此多娇，引无数英雄竞折腰。</p>
            <p class="line">惜秦皇汉武，略输文采；唐宗宋祖，稍逊风骚。</p>
            <p class="line">一代天骄，成吉思汗，只识弯弓射大雕。</p>
            <p class="line">俱往矣，数风流人物，还看今朝。</p>
        </div>
        <div class="article bottom-article">
            <h2>沁园春·雪——再来一遍</h2>
            <p>北国风光，千里冰封，万里雪飘。
                望长城内外，惟余莽莽；大河上下，顿失滔滔。
                山舞银蛇，原驰蜡象，欲与天公试比高。
                须晴日，看红装素裹，分外妖娆。
                江山如此多娇，引无数英雄竞折腰。
                惜秦皇汉武，略输文采；唐宗宋祖，稍逊风骚。
                一代天骄，成吉思汗，只识弯弓射大雕。
                俱往矣，数风流人物，还看今朝。</p>
        </div>

    </div>

    <div class="right">
        <div class="personal-logo"><img src="test.jpg" /></div>
        <div class="personal-logo"><img src="test.jpg" /></div>
        <div class="personal-logo"><img src="test.jpg" /></div>
        <div class="personal-logo bottom-logo"><img src="test.jpg" /></div>
    </div>

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