小伙伴们,学习了margin外边距属性,根据效果图的提示,补充代码 。
效果图如下:
任务
第一步:设置列表项之间的距离
第二步:设置列表项与父元素之间的距离
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>margin外边距</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
}
ul{
list-style:none;width:300px;height:400px;
background-color:pink;
padding-top:40px;
}
li{
width:200px;height:50px;background-color:yellow;
/*样式补充*/
margin: 40px;
}
</style>
</head>
<body>
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
</body>
</html>