<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="shortcut icon" href="img/mynote.ico" />
<title>盒子模型</title>
<style type="text/css">
#div1 {
width: 300px;
/*vw、vh、vmin、vmax 是一种视窗单位，也是相对单位。它相对的不是父节点或者页面的根节点。而是由视窗（Viewport）大小来决定的，单位 1，代表类似于 1%。
视窗(Viewport)是你的浏览器实际显示内容的区域—，换句话说是你的不包括工具栏和按钮的网页浏览器。
具体描述如下：
vw：视窗宽度的百分比（1vw 代表视窗的宽度为 1%）
vh：视窗高度的百分比
vmin：当前 vw 和 vh 中较小的一个值
vmax：当前 vw 和 vh 中较大的一个值*/
height: 50vh;
background: gold;
margin: 100px;
padding: 100px;
/*边框的宽度,样式,颜色*/
border: 100px solid black;
/*边框样式分为:
dotted 定义点状边框。在大多数浏览器中呈现为实线。
dashed 定义虚线。在大多数浏览器中呈现为实线。
solid 定义实线。
double 定义双线。双线的宽度等于 border-width 的值。*/
}
</style>
</head>
<body>
<div id="div1">
盒子模型分为外边框,边框,内边框
</div>
</body>
</html>
1500
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
