发表于： 2019-11-08 19:53:09
1 982
今天做的事
把任务7的图2完成了90%
还差一个音乐控件没有安装
代码如下
整个布局虽然是完成了
但是理解的还不是很透彻
调试了很多次才写了出来
以后要多写多加深理解才行
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Title</title>
<link rel="stylesheet" href="task7.2.css">
</head>
<body>
<div class="container">
<div class="header">
<div class="header">
<div class="header1">
<img src="../img/4.png" height="40" width="39"/>
投票
<img src="../img/5.png" height="36" width="36"/>
</div>
<div class="header2">
<div class="header2_2">
发言讨论结束,请大家投票
<img src="../img/6.png" height="40" width="40"/>
</div>
</div>
<div class="header2_3"></div>
<div class="header2_4">
点击得票数最多人的头像
</div>
</div>
</div>
<div class="main">
<div class="ccc">
<div class="a1">
<div class="main_1">
水民
</div>
<div class="main_2">
1号
</div>
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
<div class="ccc">
<div class="a1">
<div class="main_1">
水民
</div>
<div class="main_2">
2号
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
</div>
<div class="ccc">
<div class="a1">
<div class="main_1">
警察
</div>
<div class="main_2">
3号
</div>
<img class="xxx"src="../img/8.png" height="25" width="100"/>
</div>
</div>
</div>
<div class="main">
<div class="ccc">
<div class="a1">
<div class="main_1_1">
法官
</div>
<div class="main_2">
4号
</div>
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
<div class="ccc">
<div class="a1">
<div class="main_1_1">
狙击手
</div>
<div class="main_2">
5号
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
</div>
<div class="ccc">
<div class="a1">
<div class="main_1_1">
医生
</div>
<div class="main_2">
6号
</div>
<img class="xxx"src="../img/8.png" height="25" width="100"/>
</div>
</div>
</div>
<div class="main">
<div class="ccc">
<div class="a1">
<div class="main_1_1">
杀手
</div>
<div class="main_2">
7号
</div>
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
<div class="ccc">
<div class="a1">
<div class="main_1_1">
水民
</div>
<div class="main_2">
8号
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
</div>
<div class="ccc">
<div class="a1">
<div class="main_1_1">
水民
</div>
<div class="main_2">
9号
</div>
<img class="xxx"src="../img/8.png" height="25" width="100"/>
</div>
</div>
</div>
<div class="main">
<div class="ccc_1">
<div class="a1">
<div class="main_1_1">
水民
</div>
<div class="main_2">
10号
</div>
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
<div class="ccc_1">
<div class="a1">
<div class="main_1_1">
水民
</div>
<div class="main_2">
11号
</div>
<img class="xxx" src="../img/8.png" height="25" width="100"/>
</div>
</div>
<div class="ccc_1">
<div class="a1">
<div class="main_1_1">
水民
</div>
<div class="main_2">
12号
</div>
<img class="xxx"src="../img/8.png" height="25" width="100"/>
</div>
</div>
</div>
<div class="footer">
<div class="footer_1">
投死
</div>
</div>
</div>
</body>
</html>
效果如图
今天的收获
对flex布局运用的更熟料了
明天的计划
做完第三张图
然后调试好之间的链接
遇到的问题
最下面的宽度不知道怎么调整
返回列表
评论