首页 前端知识 HTML-CSS练习2

HTML-CSS练习2

2024-08-12 10:08:47 前端知识 前端哥 163 484 我要收藏
<!DOCTYPE html>
<html>
    <head>
       <meta charset="UTF-8">
       <title></title>
       <style>
/*
          #box ul {
             width: 500px;
             height: 100px;
             list-style: none;
             border: 1px solid gray;
                padding: 0;

          }
          #box ul img{
             float: left;
             width: 82px;
             height: 82px;
             border: 1px solid gray;
             padding: 2px;
             margin: 6px
          }
*/
/* 参考答案       */
          ul {list-style: none; padding: 0;}

          ul {
             width: 500px;
             height: 100px;
             border: 1px solid gray;

          }

          ul li {
             float: left;
             width: 70px;
             height: 70px;
             border: 1px solid gray;
             padding: 5px;
             margin: 9px;
          }

          ul li img {
             width: 100%;
             height: 100%;
          }










       </style>
    </head>
    <body>

       <div id="box">

          <ul>
             <li><img src="a.png" /></li>
             <li><img src="a.png" /></li>
             <li><img src="a.png" /></li>
             <li><img src="a.png" /></li>
             <li><img src="a.png" /></li>
          </ul>

       </div>

    </body>
</html>
复制
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
/*
#box ul {
width: 500px;
height: 100px;
list-style: none;
border: 1px solid gray;
padding: 0;
}
#box ul img{
float: left;
width: 82px;
height: 82px;
border: 1px solid gray;
padding: 2px;
margin: 6px
}
*/
/* 参考答案 */
ul {list-style: none; padding: 0;}
ul {
width: 500px;
height: 100px;
border: 1px solid gray;
}
ul li {
float: left;
width: 70px;
height: 70px;
border: 1px solid gray;
padding: 5px;
margin: 9px;
}
ul li img {
width: 100%;
height: 100%;
}
</style>
</head>
<body>
<div id="box">
<ul>
<li><img src="a.png" /></li>
<li><img src="a.png" /></li>
<li><img src="a.png" /></li>
<li><img src="a.png" /></li>
<li><img src="a.png" /></li>
</ul>
</div>
</body>
</html>
复制

转载请注明出处或者链接地址:https://www.qianduange.cn//article/15316.html
评论
发布的文章

安装Nodejs后,npm无法使用

2024-11-30 11:11:38

大家推荐的文章
会员中心 联系我 留言建议 回顶部
复制成功!