CSS 基础教程-061 CSS 框模型概述

由 hrs, 9 二月, 2020

实例代码：

<!doctype html>
<html>
        <head>
            <meta charset="utf-8">
            <style type="text/css">
            div.box {
                width:300px;   /*设置宽度为300px*/
                height:100%;   /* 设置设为100%*/
                padding:5px;    /*设置内边为5px*/
                margin:10px;           /* 设置外边距为10px*/
                border:1px solid blue; /* 设置边框为蓝色*/
                background-color:yellow; /*设置背景为黄色*/
                text-align:center; /* 设置文本居中*/
                                                        
                }
            
            </style>
        </head>

        <body>
          <h3>框模型实例</h3>

          <div class="box" >
                  <p>框模型实例</p>
          </div>
        
        </body>
</html>

运行效果：

css_061.png

标签

评论