|
导读网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立... 网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。 本篇文章给大家带来的内容是关于css盒模型是什么?css盒模型的简单介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。盒模型1.定义1.任意一个元素都可以当作盒模型 2.盒子的大小由内容宽高(width/height)+边距(padding)+边框(border) 3.盒子由外边距(margin),影响盒子的位置 广义盒模型:文档中所有功能性及内容性标签,及文档中所有显示性标签. 狭义盒模型:文档中以块级形式存在的标签(块级标签拥有盒模型100%特性且最常用) 2.盒模型成员介绍content通过设置width与height来规定content 块级标签可以设置自身宽高,默认宽为父级宽(width=auto),高为自动(由内容撑开) 内联标签不可以设置自身宽高,默认均为自动(由内容撑开)
borderborder(边框)由border-width(宽度)、border-color(颜色)、border-style(风格)三部分组成 border成员:border-left、border-right、border-top、border-bottom border-width成员:border-left-width、border-right-width、border-top-width、border-bottom-width border-color成员:border-left-color、border-right-color、border-top-color、border-bottom-color border-style成员:border-left-style、border-right-style、border-top-style、border-bottom-style
| solid | 实线 | | dashed | 虚线 | | dotted | 点状线 | | double | 双实线 | | groove | 槽状线 | | ridge | 脊线 | | inset | 内嵌效果线 | | outset | 外凸效果线 |
margin| 1 | 上下左右 | | 2 | 上下|左右 | | 3 | 上|左右|下 | | 4 | 上|右|下|左 |
3.边界圆角border-radius| border-top-left-radius | 左上 方位 | | border-top-right-radius | 右上 方位 | | border-bottom-left-radius | 左下 方位 | | border-bottom-right-radius | 右下 方位 |
赋值个数(值类型:长度或百分比):1 解释为:横纵 赋值个数(值类型:长度或百分比):2 解释为:横|纵 格式:1/1 解释为:横向|纵向
4.其他相关属性max|min-width|height overflow
| visible | 默认值。内容不会被修剪,会呈现在元素框之外。 | | hidden | 内容会被修剪,并且其余内容是不可见的。 | | scroll | 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。 | | auto | 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。 | | inherit | 规定应该从父元素继承 overflow 属性的值。 |
| inline | 内联 | | block | 块级 | | inline-block | 内联块 |
5.盒模型布局盒模型布局基本介绍布局方位:margin-left、margin-right、margin-top、margin-bottom 影响自身布局:margin-left、margin-top 影响兄弟布局:margin-right、margin-bottom 正向 / 反向:正值 / 负值
margin布局坑以上就是css盒模型是什么?css盒模型的简单介绍的详细内容,更多请关注php中文网其它相关文章!
网站建设是一个广义的术语,涵盖了许多不同的技能和学科中所使用的生产和维护的网站。
|