实例
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>天上天下 </title>
<!-- 这是style标签-->
<style>
p{color:red}
.yellow{color:yellow}
#pink{color:pink}
</style>
</head>
<body>
<!--style属性-->
<p style="color:blue">准确把握中美关系的根本性问题</p>
<p class="yellow">才能为两国关系未来发展定向把舵</p>
<p id="pink">在刚结束的二十国集团大阪峰会上</p>
<p>中美两国元首达成共识</p>
<h2>后台管理</h2>
<ul style="float: left">
<li><a href="demo3.html" target="main">用户管理</a> </li>
<li><a href="demo4.html" target="main">分类管理</a> </li>
<li><a href="demo5.html" target="main">商品管理</a> </li>
<li><a href="demo6.html" target="main">系统设置</a> </li>
</ul>
<iframe srcdoc="<h3>网站管理后台<h3>" frameborder=""name="main" width="500" height="800" style="float:left;
margin-left:20px"></iframe>
</body>
</html>
运行实例 »
点击 "运行实例" 按钮查看在线实例盒模型：
盒模型的内外边距只有宽度，没有颜色，默认是透明的。
盒模型外边距叫margin，内边距叫padding，边框叫border，他们是以顺时针方向排列的，分别是：
margin-top margin-right margin-bottom margin-left；
padding-top padding-right padding-bottom padding-left;
border-top border-right border-bottom border-left
