前端零基础入门页面化妆师CSS盒子模型3-24编程练习

tech2022-08-01  128

小伙伴们,学习了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>

最新回复(0)