收藏
批改状态：合格
老师批语：作业已检查！
手写代码未提交！请及时提交！
博客发布作业中添加了线上运行代码的新功能！
群文中找到入群必读文件夹下的博客如何提交作业.gif图下载了解！！
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<style type="text/css">
div{
margin-right: auto;
margin-left: auto;
height: 200px;
background: purple;
width: 830px;
text-align: center;
font-size: 30px;
}
.div1{
background: coral;
float: left;
width: 200px;
}
.div2{
background: blue;
float: left;
width: 200px;
margin-left: 10px;
}
.div3{
background:peachpuff;
float: left;
width: 200px;
margin-left: 10px;
}
.div4{
background: cadetblue;
float: left;
width: 200px;
margin-left: 10px;
}
ul {
padding:0;
margin: 0;
width: 450px;
border: 1px dashed #666;
padding: 100px 5px;
}
li {
list-style: none; /*去掉默认列表项样式*/
float: left; /*左浮动*/
width: 40px; /*设置宽度*/
height: 40px; /*设置高度*/
line-height: 40px; /*文本垂直居中*/
text-align: center; /*文本水平居中*/
border-radius: 50%; /*设置边框圆角*/
background: skyblue; /*背景色天蓝*/
margin-right: 5px; /*每个球之间的右外边距*/
}
ul li:last-child {
background-color: lightgreen;
}
ul:after { /*子块撑开父块*/
content:''; /*在子元素尾部添加空内容元素*/
display: block; /*并设置为块级显示*/
clear:both; /*清除二边的浮动*/
/*visibility: none; !*hidden也行*!*/
/*height: 0;*/
/*_height: 1%; !*针对IE*!*/
}
</style>
<body >
<div>
<DIV >
<p valign="middle">包</p>
</DIV>
<DIV>
<p>你</p>
</DIV>
<DIV>
<p>中</p>
</DIV>
<DIV>
<p>奖</p>
</DIV>
</div>
<ul>
<li id="item1">1</li>
<li>2</li>
<li class="green red">3</li>
<li>4</li>
<li>5</li>
<li id="item2">6</li>
<li>7</li>
<li class="php css">8</li>
<li>9</li>
<li>10</li>
</ul>
</body>
</html>
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
