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

HTML-CSS练习2

2024-08-12 10:08:47 前端知识 前端哥 158 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
评论
发布的文章

jQuery3 学习手册(三)

2024-08-18 22:08:04

vue和jQuery有什么区别

2024-04-29 11:04:47

推荐项目:jQuery.Gantt

2024-08-18 22:08:37

jQuery UI 秘籍(一)

2024-08-18 22:08:15

jQuery详解

2024-04-29 11:04:38

echarts饼图点击图例问题

2024-08-18 22:08:48

echarts天气折线图

2024-08-18 22:08:46

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