ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

css盒模型 Box Model

2019-09-13 14:00:31  阅读:247  来源: 互联网

标签:Box 盒子 边框 内边 css 25px Model display CSS


属性:内容(content)、内边距(padding)、边框(border)、外边距(margin), CSS盒子模式都具备这些属性。

   CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。

盒子的分类:不同的元素产生的盒子类型可能不同, 一个元素,产生什么样的盒子,取决于它CSS的display属性

display:none:不生成盒子

display:inline:行盒

display:block:块盒

盒子组成:

Margin(外边距) - 清除边框外的区域,外边距是透明的。

Border(边框) - 围绕在内边距和内容外的边框。

Padding(内边距) - 清除内容周围的区域,内边距是透明的。

Content(内容) - 盒子的内容,显示文本和图像。

例:

div {
    width: 300px;
    border: 25px solid green;
    padding: 25px;
    margin: 25px;
}

 

 

标签:Box,盒子,边框,内边,css,25px,Model,display,CSS
来源: https://www.cnblogs.com/muxi95/p/11516745.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有