老师检查一下,辛苦OVO~
来源:2-6 编程练习
江伍德
2021-01-26 23:05:41
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
li{
width: 200px;
height: 50px;
border: 2px solid transparent;
/* margin-top: 10px; */
}
.li1{
border-top-color:red ;
}
.li2{
border-right:2px dotted green;
}
.li3{
border-bottom:2px dashed blue;
}
.li4{
border-left-color: purple ;
}
</style>
</head>
<body>
<ul>
<li class="li1">第一个li</li>
<li class="li2">第二个li</li>
<li class="li3">第三个li</li>
<li class="li4">第四个li</li>
</ul>
</body>
</html>
1回答
同学你好,代码中的问题解答如下:
1、任务要求中需要设置第四个li为3px,代码中没有设置;
2、另外可以优化一下,由于每个边框设置的样式都不一样,设置公共样式的意义不大,因此可以去掉2px的透明边框设置,给第一个li设置为2px的边框。
如下图修改:
祝学习愉快!
相似问题