-
css教程之方框属性
方框属性(相关css教程)
上边界属性用一个指定的长度或百分比值来设置元素的上边界。百分比值参考上级元素的宽度。允许使用负值边际。
例如,以下的规则将消除文件的上边界。
BODY { margin-top: 0 }
注意如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。
右边界
右边界属性用一个指定的长度或百分比值来设置元素的右边界。百分比值参考上级元素的宽度。允许使用负值边际。
例如:
P.narrow { margin-right: 50% }
注意如果边界在水平方向邻接(重叠)了,不会改用其它边界值。
下边界
下边界属性用一个指定的长度或百分比值来设置元素的下边界。百分比值参考上级元素的宽度。允许使用负值边际。
例如:
DT { margin-bottom: 3em }
注意如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。
左边界
左边界属性用一个指定的长度或百分比值来设置元素的左边界。百分比值参考上级元素的宽度。允许使用负值边际。
例如:
ADDRESS { margin-left: 50% }
注意如果边界在水平方向邻接(重叠)了,不会改用其它边界值。
边界
边界属性用一到四个值来设置元素的边界,每个值都是长度、百分比或者自动。百分比值参考上级元素的宽度。允许使用负值边际。
如果四个值都给出了,它们分别被应用于上、右、下和左边界。如果只给出一个值,它被应用于所有边界。如果两个或三个值给出了,省略了的值与对边相等。
边界声明包括以下例子:
BODY { margin: 5em } /* 所有边界设为5em */
P { margin: 2em 4em } /* 上和下边界为2em,左和右边界为4em */
DIV { margin: 1em 2em 3em 4em } /* 上边界为1em,右边界为2em,下边界为3em,左边界为4em */
注意如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。而水平方向则不会。
使用边界属性可以一次性地设置所有边界;也可以选择使用上边界、下边界、左边界和右边界属性。
上补白
上补白属性描述上边框和选择符的内容之间有多少间隔。该值可以是一个长度或百分比。百分比的值参考上级元素的宽度。不能使用负值。
右补白
右补白属性描述右边框和选择符的内容之间有多少间隔。该值可以是一个长度或百分比。百分比的值参考上级元素的宽度。不能使用负值。
下补白
下补白属性描述下边框和选择符的内容之间有多少间隔。该值可以是一个长度或百分比。百分比的值参考上级元素的宽度。不能使用负值。
左补白
左补白属性描述左边框和选择符的内容之间有多少间隔。该值可以是一个长度或百分比。百分比的值参考上级元素的宽度。不能使用负值。
补白
补白属性是上补白、右补白、下补白和左补白属性的略写。
一个元素的补白是边框和元素的内容之间的间隔的数值。可以给出从一到四的值,每个值可以是长度或百分比。百分比值参考上级元素的宽度。不能使用负值。
如果四个值都给出了,它们分别应用于上、右、下和左补白。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
例如,以下的规则设置上补白为2em,右补白为4em,下补白为5em,左补白为4em:
BLOCKQUOTE { padding: 2em 4em 5em }
上边框宽度
上边框宽度属性用于指定一个元素上边框的宽度。值可以是三个关键字其中的一个,都不受字体大小或长度的影响,可以用于实现成比例的宽度。不允许使用负值。
也可以用在上边框、边框的宽度或边框的属性略写。
右边框宽度
右边框宽度属性用于指定元素的右边框的宽度。值可以是三个关键字其中的一个,都不受字体大小或长度的影响,可以用于实现成比例的宽度。不允许使用负值。
也可以用在右边框、边框的宽度或边框的属性略写。
下边框宽度
下边框宽度属性用于指定元素的下边框的宽度。值可以是三个关键字其中的一个,都不受字体大小或长度的影响,可以用于实现成比例的宽度。不允许使用负值。
也可以用在下边框、边框的宽度或边框的属性略写。
左边框宽度
左边框宽度属性用于指定元素的左边框的宽度。值可以是三个关键字其中的一个,都不受字体大小或长度的影响,可以用于实现成比例的宽度。不允许使用负值。
也可以用在左边框、边框的宽度或边框的属性略写。
边框宽度
边框宽度属性用一到四个值来设置元素的边界,值是一个关键字或长度。不允许使用负值长度。
如果四个值都给出了,它们分别应用于上、右、下和左边框的式样。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
这个属性是上边框宽度、右边框宽度、下边框宽度和左边框宽度属性的略写。
也可以使用略写的边框属性。
边框颜色
边框颜色属性设置一个元素的边框颜色。可以使用一到四个关键字。如果四个值都给出了,它们分别应用于上、右、下和左边框的式样。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
也可以使用略写的边框属性。
边框样式
边框样式属性用于设置一个元素边框的样式。这个属性必须用于指定可见的边框。
可以使用一到四个关键字。如果四个值都给出了,它们分别应用于上、右、下和左边框的式样。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
也可以使用略写的边框属性。
上边框
上边框属性是一个用于设置一个元素上边框的宽度、式样和颜色的略写。
注意只能给出一个边框式样。
也可以使用略写的边框属性。
右边框
右边框属性是一个用于设置一个元素右边框的宽度、式样、和颜色的略写。
注意只能给出一个边框式样。
也可以使用略写的边框属性。
下边框
下边框属性是一个用于设置一个元素的下边框的宽度、式样和颜色的略写。
注意只能给出一个边框式样。
也可以使用略写的边框属性。
左边框
左边框属性是一个用于设置一个元素左边框的宽度、式样和颜色的略写。
注意只能给出一个边框式样。
也可以使用略写的边框属性。
边框
边框属性是一个用于设置一个元素边框的宽度、式样和颜色的略写。
边框声明的例子包括:
H2 { border: groove 3em }
A:link { border: solid blue }
A:visited { border: thin dotted #800080 }
A:active { border: thick double red }
边框属性只能设置四种边框;只能给出一组边框的宽度和式样。为了给出一个元素的四种边框的不同的值,网页制作者必须用一个或更多的属性,如:上边框、右边框、下边框、左边框、边框颜色、边框宽度、边框式样、上边框宽度、右边框宽度、下边框宽度或左边框宽度。
宽度
每个块级或替换元素都可以用一个长度或“auto”值来指定其宽度。(替换元素仅指一些已知原有尺寸的元素。HTML替换元素包括 IMG, INPUT, TEXTAREA, SELECT, 和 OBJECT.) 宽度属性的初始值为“auto”,即为该元素的原有宽度(有就是元素自己的宽度,例如一个图象的宽度)。百分比参考上级元素的宽度。不允许使用负的长度值。
这个属性能用作给出一些INPUT元素的公共长度,好象SUBMIT和RESET按钮:
INPUT.button { width: 10em }
高度
每个块级或替换元素都可以用一个长度或“auto”值来指定其高度。(替换元素仅指一些已知原有尺寸的元素。HTML替换元素包括 IMG, INPUT, TEXTAREA, SELECT, 和 OBJECT.) 高度属性的初始值为“auto”,即为该元素的原有高度(有就是元素自己的高度,例如一个图象的高度)。不允许使用负的长度值。
与宽度属性一样,高度可以应用于设定图象的比例:
IMG.foo { width: 40px; height: 40px }
在大多数情况下,我们都建议网页制作者使用图象编辑软件按比例伸缩图象,因为浏览器不可能高质量地伸缩图象,也因为使用这个属性缩小图象会导致用户下载了一个不必要的庞大文件。虽然如此,通过宽度和高度属性伸缩图象依然是用户—定义样式表中一个有用的用作克服视觉问题的选择。
漂浮
漂浮属性允许网页制作者将文本环绕在一个元素的周围. 这同HTML 3.2中IMG元素的ALIGN=left和ALIGN=right一样,但CSS1允许所有对象“漂浮”,而不像HTML 3.2那样仅仅允许图象和表格。
清除
清除属性指定一个元素是否允许有元素漂浮在它的旁边。值left移动元素到在其左边的漂浮的元素的下面;同样的值right移动到其右边的漂浮的元素下面。其他的还有缺省的none值,和移动元素到其两边的漂浮的元素的下面的none值。这个属性类似于HTML 3.2的函数<BR CLEAR=left|right|all|none>,但它能应用于所有元素。
- 上边界
- 右边界
- 下边界
- 左边界
- 边界
- 上补白
- 右补白
- 下补白
- 左补白
- 补白
- 上边框宽度
- 右边框宽度
- 下边框宽度
- 左边框宽度
- 边框宽度
- 边框颜色
- 边框式样
- 上边框
- 右边框
- 下边框
- 左边框
- 边框
- 宽度
- 高度
- 漂浮
- 清除
语法: | margin-top: <值> |
允许值: | <长度> | <百分比> | auto |
初始值: | 0 |
适用于: | 所有元素 |
向下兼容: | 否 |
例如,以下的规则将消除文件的上边界。
BODY { margin-top: 0 }
注意如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。
右边界
语法: | margin-right: <值> |
允许值: | <长度> | <百分比> | auto |
初始值: | 0 |
适用于: | 所有元素 |
向下兼容: | 否 |
例如:
P.narrow { margin-right: 50% }
注意如果边界在水平方向邻接(重叠)了,不会改用其它边界值。
下边界
语法: | margin-bottom: <值> |
允许值: | <长度> | <百分比> | auto |
初始值: | 0 |
适用于: | 所有元素 |
向下兼容: | 否 |
例如:
DT { margin-bottom: 3em }
注意如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。
左边界
语法: | margin-left: <值> |
允许值: | <长度> | <百分比> | auto |
初始值: | 0 |
适用于: | 所有元素 |
向下兼容: | 否 |
例如:
ADDRESS { margin-left: 50% }
注意如果边界在水平方向邻接(重叠)了,不会改用其它边界值。
边界
语法: | margin: <值> |
允许值: | [ <长度> | <百分比> | auto ]{1,4} |
初始值: | 未定义 |
适用于: | 所有元素 |
向下兼容: | 否 |
如果四个值都给出了,它们分别被应用于上、右、下和左边界。如果只给出一个值,它被应用于所有边界。如果两个或三个值给出了,省略了的值与对边相等。
边界声明包括以下例子:
BODY { margin: 5em } /* 所有边界设为5em */
P { margin: 2em 4em } /* 上和下边界为2em,左和右边界为4em */
DIV { margin: 1em 2em 3em 4em } /* 上边界为1em,右边界为2em,下边界为3em,左边界为4em */
注意如果边界在垂直方向邻接(重叠)了,会改用其中最大的那个边界值。而水平方向则不会。
使用边界属性可以一次性地设置所有边界;也可以选择使用上边界、下边界、左边界和右边界属性。
上补白
语法: | padding-top: <值> |
允许值: | <长度> | <百分比> |
初始值: | 0 |
适用于: | 所有对象 |
向下兼容: | 否 |
右补白
语法: | padding-right: <值> |
允许值: | <长度> | <百分比> |
初始值: | 0 |
适用于: | 所有对象 |
向下兼容: | 否 |
下补白
语法: | padding-bottom: <值> |
允许值: | <长度> | <百分比> |
初始值: | 0 |
适用于: | 所有对象 |
向下兼容: | 否 |
左补白
语法: | padding-left: <值> |
允许值: | 长度 | <百分比> |
初始值: | 0 |
适用于: | 所有对象 |
向下兼容: | 否 |
补白
语法: | padding: <值> |
允许值: | [ 长度 | <百分比> ]{1,4} |
初始值: | 0 |
适用于: | 所有对象 |
向下兼容: | 否 |
一个元素的补白是边框和元素的内容之间的间隔的数值。可以给出从一到四的值,每个值可以是长度或百分比。百分比值参考上级元素的宽度。不能使用负值。
如果四个值都给出了,它们分别应用于上、右、下和左补白。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
例如,以下的规则设置上补白为2em,右补白为4em,下补白为5em,左补白为4em:
BLOCKQUOTE { padding: 2em 4em 5em }
上边框宽度
语法: | border-top-width: <值> |
允许值: | thin | medium | thick | 长度 |
初始值: | medium |
适用于: | 所有对象 |
向下兼容: | 否 |
也可以用在上边框、边框的宽度或边框的属性略写。
右边框宽度
语法: | border-right-width: <值> |
允许值: | thin | medium | thick | 长度 |
初始值: | medium |
适用于: | 所有对象 |
向下兼容: | 否 |
也可以用在右边框、边框的宽度或边框的属性略写。
下边框宽度
语法: | border-bottom-width: <值> |
允许值: | thin | medium | thick | 长度 |
初始值: | medium |
适用于: | 所有对象 |
向下兼容: | 否 |
也可以用在下边框、边框的宽度或边框的属性略写。
左边框宽度
语法: | border-left-width: <值> |
允许值: | thin | medium | thick | 长度 |
初始值: | medium |
适用于: | 所有对象 |
向下兼容: | 否 |
也可以用在左边框、边框的宽度或边框的属性略写。
边框宽度
语法: | border-width: <值> |
允许值: | [ thin | medium | thick | 长度 ]{1,4} |
初始值: | 未定义 |
适用于: | 所有对象 |
向下兼容: | 否 |
如果四个值都给出了,它们分别应用于上、右、下和左边框的式样。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
这个属性是上边框宽度、右边框宽度、下边框宽度和左边框宽度属性的略写。
也可以使用略写的边框属性。
边框颜色
语法: | border-color: <值> |
允许值: | <颜色>{1,4} |
初始值: | 颜色属性的值 |
适用于: | 所有对象 |
向下兼容: | 否 |
也可以使用略写的边框属性。
边框样式
语法: | border-style: <值> |
允许值: | [ none | dotted | dashed | solid | double | groove | ridge | inset | outset ]{1,4} |
初始值: | none |
适用于: | 所有对象 |
向下兼容: | 否 |
可以使用一到四个关键字。如果四个值都给出了,它们分别应用于上、右、下和左边框的式样。如果给出一个值,它将被运用到各边上。如果两个或三个值给出了,省略了的值与对边相等。
也可以使用略写的边框属性。
上边框
语法: | border-top: <值> |
允许值: | <上边框宽度> || <边框式样> || <颜色> |
初始值: | 未定义 |
适用于: | 所有对象 |
向下兼容: | 否 |
注意只能给出一个边框式样。
也可以使用略写的边框属性。
右边框
语法: | border-right: <值> |
允许值: | <右边框宽度> || <边框式样> || <颜色> |
初始值: | 未定义 |
适用于: | 所有对象 |
向下兼容: | 否 |
注意只能给出一个边框式样。
也可以使用略写的边框属性。
下边框
语法: | border-bottom: <值> |
允许值: | <下边框宽度> || <边框式样> || <颜色> |
初始值: | 未定义 |
适用于: | 所有对象 |
向下兼容: | 否 |
注意只能给出一个边框式样。
也可以使用略写的边框属性。
左边框
语法: | border-left: <值> |
允许值: | <左边框宽度> || <边框式样> || <颜色> |
初始值: | 未定义 |
适用于: | 所有对象 |
向下兼容: | 否 |
注意只能给出一个边框式样。
也可以使用略写的边框属性。
边框
语法: | border: <值> |
允许值: | <边框宽度> || <r边框式样> || <颜色> |
初始值: | 未定义 |
适用于: | 所有对象 |
向下兼容: | 否 |
边框声明的例子包括:
H2 { border: groove 3em }
A:link { border: solid blue }
A:visited { border: thin dotted #800080 }
A:active { border: thick double red }
边框属性只能设置四种边框;只能给出一组边框的宽度和式样。为了给出一个元素的四种边框的不同的值,网页制作者必须用一个或更多的属性,如:上边框、右边框、下边框、左边框、边框颜色、边框宽度、边框式样、上边框宽度、右边框宽度、下边框宽度或左边框宽度。
宽度
语法: | width: <值> |
允许值: | 长度 | <百分比> | auto |
初始值: | auto |
适用于: | 块级和替换元素 |
向下兼容: | 否 |
这个属性能用作给出一些INPUT元素的公共长度,好象SUBMIT和RESET按钮:
INPUT.button { width: 10em }
高度
语法: | height: <值> |
允许值: | 长度 | auto |
初始值: | auto |
适用于: | 块级和替换元素 |
向下兼容: | 否 |
与宽度属性一样,高度可以应用于设定图象的比例:
IMG.foo { width: 40px; height: 40px }
在大多数情况下,我们都建议网页制作者使用图象编辑软件按比例伸缩图象,因为浏览器不可能高质量地伸缩图象,也因为使用这个属性缩小图象会导致用户下载了一个不必要的庞大文件。虽然如此,通过宽度和高度属性伸缩图象依然是用户—定义样式表中一个有用的用作克服视觉问题的选择。
漂浮
语法: | float: <值> |
允许值: | left | right | none |
初始值: | none |
适用于: | 所有元素 |
向下兼容: | 否 |
清除
语法: | clear: <值> |
允许值: | none | left | right | both |
初始值: | none |
适用于: | 所有元素 |
向下兼容: | 否 |
栏目列表
最新更新
nodejs爬虫
Python正则表达式完全指南
爬取豆瓣Top250图书数据
shp 地图文件批量添加字段
爬虫小试牛刀(爬取学校通知公告)
【python基础】函数-初识函数
【python基础】函数-返回值
HTTP请求:requests模块基础使用必知必会
Python初学者友好丨详解参数传递类型
如何有效管理爬虫流量?
SQL SERVER中递归
2个场景实例讲解GaussDB(DWS)基表统计信息估
常用的 SQL Server 关键字及其含义
动手分析SQL Server中的事务中使用的锁
openGauss内核分析:SQL by pass & 经典执行
一招教你如何高效批量导入与更新数据
天天写SQL,这些神奇的特性你知道吗?
openGauss内核分析:执行计划生成
[IM002]Navicat ODBC驱动器管理器 未发现数据
初入Sql Server 之 存储过程的简单使用
这是目前我见过最好的跨域解决方案!
减少回流与重绘
减少回流与重绘
如何使用KrpanoToolJS在浏览器切图
performance.now() 与 Date.now() 对比
一款纯 JS 实现的轻量化图片编辑器
关于开发 VS Code 插件遇到的 workbench.scm.
前端设计模式——观察者模式
前端设计模式——中介者模式
创建型-原型模式