❶ 盒模型”这个概念的理解,和它都涉及到哪些css属性
border为盒子的边框,margin为盒子与外界的距离,padding为盒子里的东西与盒子边框的距离,width,height为盒子里的东西的长和宽.
border有border-top,border-bottom,border-left,border-right,分别设置上下左右的边框样式,比如border-left:2px solid red;是把左边框的粗细设置为2像素,风格为实线,颜色为红色。前面的例子为简写形式,其实际上是些为border-left-width:2px; border-left-style:solid; border-left-color:red;
border-radius有border-top-left,border-top-right,border-bottom-left,border-bottom-right,是设置盒子的四个角的半径,可以接受的单位有像素和百分比,可以将盒子的边框弄成一个圆角矩形甚至圆形。
margin有margin-top,margin-bottom,margin-left,margin-right,设置了盒子与其他元素之间的距离,比如margin-left:3px;就把盒子与左边元素的距离设置成了2像素,另外设置好body的宽度后,用margin-left:auto;margin-right:auto;就把盒子居中了。
padding有padding-left,padding-bottom,padding-right;padding-top;可以设置盒子里的东西与盒子边框的距离。
ps:margin与padding不接受颜色设置。
整个盒子的宽度为width+padding-left+padding-right+border-left-width+border-right-width;
整个盒子的高度为height+padding-top+padding-bottom+border-top-width+border-bottom-width;
❷ CSS盒子模型的介绍
网页设计中常听的属性名:内容(content)、填充(padding)、边框(border)、边界(margin), CSS盒子模式都具备这些属性。这些属性我们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也就是能装东西的一种箱子,也具有这些属性,所以叫它盒子模式。CSS盒子模型就是在网页设计中经常用到的CSS技术所使用的一种思维模型。
❸ 什么是盒子模型
在网页中,一个元素占有空间的大小由几个部分构成,其中包括元素的内容(content),元素的内边距(padding),元素的边框(border),元素的外边距(margin)四个部分。这四个部分占有的空间中,有的部分可以显示相应的内容,而有的部分只用来分隔相邻的区域或区域。4个部分一起构成了css中元素的盒模型。
❹ 什么是盒子模型啊能举个实际的例子吗
什么是CSS的盒子模式呢?为什么叫它是盒子?先说说我们在网页设计中常听的属性名:内容(content)、内边距(padding)、边框(border)、外边距(margin).在黑马程序员学习时候就会有老师教过,
CSS盒子模式这些属性我们可以把它转移到我们日常生活中的盒子(箱子)上来理解,日常生活中所见的盒子也具有这些属性,所以叫它盒子模式。那么内容就是盒子里装的东西;而内边距(padding)就是怕盒子里装的东西(贵重的)损坏而添加的泡沫或者其它抗震的辅料;边框(border)就是盒子纸板的厚度;至于外边距(margin)则说明盒子摆放的时候的不能全部堆在一起,要留一定空隙保持通风,同时也为了方便取出嘛。内容(content)就是盒子里装的东西. 在网页设计上,内容(content)常指文字、图片等元素,但是也可以是小盒子(DIV嵌套),与现实生活中盒子不同的是,现实生活中的东西一般不能大于盒子,否则盒子会被撑坏的,而CSS盒子具有弹性,里面的东西大过盒子本身最多把它撑大,但它不会损坏的。
❺ 什么是css的盒子模型
CSS盒子模型就是在CSS技术所使用的一种思维模型。CSS假定所有的HTML文档元素都生成一个描述该元素在HTML文档布局中所占空间的矩形元素框,可以形象地将其看作是一个盒子。通过定义一系列与盒子相关的属性,可极大地丰富和促进各个盒子乃至整个HTML文档的表现效果和布局结构。
CSS盒子模型由内容区、填充、边框和空白边四部分组成。内容区是盒子模型的中心,呈现盒子的主要信息内容;填充是内容区和边框之间的空间;边框是环绕内容区和填充的边界;空白边位于盒子的最外围,是添加在边框外周围的空间。
(5)前端盒子模型一般用在什么地方扩展阅读:
CSS盒子模型特点:
1、丰富的样式定义:CSS提供了丰富的文档样式外观,以及设置文本和背景属性的能力;允许为任何元素创建边框,以及元素边框与其他元素间的距离,以及元素边框与元素内容间的距离;允许随意改变文本的大小写方式、修饰方式以及其他页面效果。
2、易于使用和修改:CSS可以将样式定义在HTML元素的style属性中,也可以将其定义在HTML文档的header部分,也可以将样式声明在一个专门的CSS文件中,以供HTML页面引用。总之,CSS样式表可以将所有的样式声明统一存放,进行统一管理。
3、多页面应用:CSS样式表可以单独存放在一个CSS文件中,这样我们就可以在多个页面中使用同一个CSS样式表。CSS样式表理论上不属于任何页面文件,在任何页面文件中都可以将其引用。这样就可以实现多个页面风格的统一。
❻ web前端问题,关于盒子模型,谢谢
这个是一个标准 可以不加的
下面的dtd文件是一个用来描述文档格式的文件
也就是说 如果你加了那一句
浏览器就会根据dtd里面规定的格式进行解析
dtd规定了你html的格式
❼ box模型只能用在div里吗
我觉得应该是页面上存在的任何一个元素,包括Div在内,我们都可以把它看成一个存在于盒子模型。也就是说盒子模型不是只针对Div。这个盒子模型是相对而言的。
❽ 小白必知什么是css和盒模型
看网络就行了
css 就是 网页前端修饰语言, 也叫 层叠样式表!
顾名思义 就是一层套一层的 的来布局 网页 呈现给用户看的!
盒子模型 div+css配合, 不用特别 在意盒子模型 这个词,
你可以把盒子模型理解成 你每创建个div 用css 定义div的 宽高后 它就是个盒子!
之后你可以给这个盒子 设置背景 边框 颜色 内边距 外边距 圆角 定位 等等
❾ CSS盒子模型有什么用处,怎么用
如果你对CSS有相关知识的话,以下的东西你可以看懂的:CSS盒子 http://ke..com/view/2758739.htm?fr=ala0_1