发表于： 2020-08-04 23:37:17
2 1253
了解到了一些css样式，比如css3圆角属性可以直接使用bord-radius来生成圆角，参考自：http://www.ruanyifeng.com/blog/2010/12/detailed_explanation_of_css3_rounded_corners.html(CSS3圆角详解)
以及css自适应屏幕：
https://www.cnblogs.com/cuoreqzt/p/5848270.html(CSS百分比实现高度占位自适应（margin/padding）)
最后定义出.css文件
div{
width: 30%;
/*height: 80px;*/
float: left;
border-radius: 15px;
padding-top: 30%;
margin-left: 2%;
margin-top: 2%;
background-color: orange;
}
在html中引入这个.css并且建立九个盒子模型
<!DOCTYPE html>
<html lang="en">
<link rel="stylesheet" type="text/css" href="../css/boxAttribute.css">
<head>
<meta charset="UTF-8">
<title>盒子模型</title>
</head>
<body>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</body>
</html>
最终可以生成
返回列表
评论