css3盒子模型案例附代码与教程

先看下代码案例：

  1. <!DOCTYPE html>
  2. <html lang=”en”>
  3. <head>
  4.     <meta charset=”UTF-8″>
  5.     <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
  6.     <meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
  7.     <title>css3盒子模型案例-IT战蚁</title>
  8.     <style>
  9.         div:nth-child(1) {
  10.             width: 200px;
  11.             height: 200px;
  12.             background-color: pink;
  13.             border: 5px red solid;
  14.             padding: 10px;
  15.         }
  16.         div:nth-child(2) {
  17.             width: 200px;
  18.             height: 200px;
  19.             background-color: pink;
  20.             border: 5px red solid;
  21.             padding: 10px;
  22.             box-sizing: border-box;
  23.         }
  24.     </style>
  25. </head>
  27. <body>
  28.     <div></div>
  29.     <div></div>
  30. </body>
  31. </html>

复制代码 代码运行结果：


css3盒子代码案例教程.jpg (4.93 KB, 下载次数: 40)

下载附件

css3盒子模型案例附代码与教程

2020-1-6 11:28 上传

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。