站长百科 | 数字化技能提升教程 数字化时代生存宝典
首页
数字化百科
电子书
建站程序
开发
服务器
办公软件
开发教程
服务器教程
软件使用教程
运营教程
热门电子书
WordPress教程
宝塔面板教程
CSS教程
Shopify教程
导航
程序频道
推广频道
网赚频道
人物频道
网站程序
网页制作
云计算
服务器
CMS
论坛
网店
虚拟主机
cPanel
网址导航
WIKI使用导航
WIKI首页
最新资讯
网站程序
站长人物
页面分类
使用帮助
编辑测试
创建条目
网站地图
站长百科导航
站长百科
主机侦探
IDCtalk云说
跨境电商导航
WordPress啦
站长专题
网站推广
网站程序
网站赚钱
虚拟主机
cPanel
网址导航专题
云计算
微博营销
虚拟主机管理系统
开放平台
WIKI程序与应用
美国十大主机
编辑“
CSS定位
”
人物百科
|
营销百科
|
网赚百科
|
站长工具
|
网站程序
|
域名主机
|
互联网公司
|
分类索引
跳转至:
导航
、
搜索
警告:
您没有登录。如果您做出任意编辑,您的IP地址将会公开可见。如果您
登录
或
创建
一个账户,您的编辑将归属于您的用户名,且将享受其他好处。
反垃圾检查。
不要
加入这个!
<span style="text-align:center; border:1px solid #000; float:right; padding:6px;"><strong>导航:</strong> [[CSS学习教程#CSS学习教程|上一页]] | {{template:开发语言导航}}</span> <div style="clear:both;"></div> ==position== 语法:[[position]] : static | absolute | fixed | relative <br> 取值:<br> static : 默认值。无特殊定位,对象遵循HTML定位规则 <br> absolute : 将对象从文档流中拖出,使用 left , right , top , bottom 等属性相对于其最接近的一个最有定位设置的父对象进行绝对定位。如果不存在这样的父对象,则依据 body 对象。而其层叠通过 z-index 属性定义 <br> fixed : 未支持。对象定位遵从绝对(absolute)方式。但是要遵守一些规范 <br> relative : 对象不可层叠,但将依据 left , right , top , bottom 等属性在正常文档流中偏移位置 <br> 说明:<br> 检索对象的定位方式。<br> 设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位而不考虑它周围内容的布局。假如其他具有不同 z-index 属性的对象已经占据了给定的位置,他们之间不会相互影响,而会在同一位置层叠。此时对象不具有外补丁( margin ),但仍有内补丁( padding )和边框( border )。<br> 要激活对象的绝对(absolute)定位,必须指定 left , right , top , bottom 属性中的至少一个,并且设置此属性值为 absolute 。否则上述属性会使用他们的默认值 auto ,这将导致对象遵从正常的HTML布局规则,在前一个对象之后立即被呈递。<br> 设置此属性值为 relative 会保持对象在正常的HTML流中,但是它的位置可以根据它的前一个对象进行偏移。在相对(relative)定位对象之后的文本或对象占有他们自己的空间而不会覆盖被定位对象的自然空间。与此不同的,在绝对(absolute)定位对象之后的文本或对象在被定位对象被拖离正常文档流之前会占有它的自然空间。放置绝对(absolute)定位对象在可视区域之外会导致滚动条出现。而放置相对(relative)定位对象在可视区域之外,滚动条不会出现。<br> 内容的尺寸会根据布局确定对象的尺寸。例如,设置一个 div 对象的 height 和 position 属性,则 div 对象的内容将决定它的宽度( width )。<br> 此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。<br> 对应的脚本特性为 position 。 <br> 示例:div { position:relative; top:-3px } <br> ==z-index== 语法:z-index : auto | number <br> 取值:<br> auto : 默认值。遵从其父对象的定位 <br> number : 无单位的整数值。可为负数 <br> 说明:<br> 检索或设置对象的层叠顺序。<br> 较大 number 值的对象会覆盖在较小 number 值的对象之上。如两个绝对定位对象的此属性具有同样的 number 值,那么将依据它们在HTML文档中声明的顺序层叠。对于未指定此属性的绝对定位对象,此属性的 number 值为正数的对象会在其之上,而 number 值为负数的对象在其之下。设置参数为 null 可以移除此属性。<br> 此属性仅仅作用于 position 属性值为 relative 或 absolute 的对象。<br> 这个属性不会作用于窗口控件,如 select 对象。<br> 在IE5.5+中, iframe 对象开始支持此属性。而在之前的浏览器版本中, iframe 对象是窗口控件,会忽略此属性。此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。<br> 对应的脚本特性为 zIndex 。 <br> 示例:div { position:absolute; z-index:3; width:6px; } <br> ==top== 语法:top : auto | length <br> 取值:<br> auto : 默认值。无特殊定位,根据HTML定位规则在文档流中分配 <br> length : 由浮点数字和单位标识符组成的长度值 | 百分数。必须定义 position 属性值为 absolute 或者 relative 此取值方可生效。<br> 说明:<br> 检索或设置对象与其最近一个具有定位设置的父对象顶边相关的位置。<br> 此属性仅仅在对象的定位( position )属性被设置时可用。否则,此属性设置会被忽略。<br> 此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。<br> 对应的脚本特性为 top 。其值为一字符串,所以不可用于脚本(Scripts)中的计算。请使用 style 对象的 posTop , pixelTop 等运行时特性,以及对象的offsetTop 等特性。 <br> 示例:<br> div { position: absolute; top: 1in; }<br> div { position:relative; top:-3px; left:6px; } <br> ==right== 语法:right : auto | length <br> 取值:<br> auto : 默认值。无特殊定位,根据HTML定位规则在文档流中分配 <br> length : 由浮点数字和单位标识符组成的长度值 | 百分数。必须定义 position 属性值为 absolute 或者 relative 此取值方可生效。<br> 说明:<br> 检索或设置对象与其最近一个具有定位设置的父对象右边相关的位置。<br> 此属性仅仅在对象的定位( position )属性被设置时可用。否则,此属性设置会被忽略。<br> 此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。<br> 对应的脚本特性为 right 。其值为一字符串,所以不可用于脚本(Scripts)中的计算。请使用 style 对象的 posRight , pixelRight 等运行时特性。 <br> 示例:<br> div { position: absolute; right: 1in; }<br> div { position:relative; top:-3px; right:6px; } <br> ==bottom== 语法:bottom : auto | length <br> 取值:<br> auto : 默认值。无特殊定位,根据HTML定位规则在文档流中分配 <br> length : 由浮点数字和单位标识符组成的长度值 | 百分数。必须定义 position 属性值为 absolute 或者 relative 此取值方可生效。<br> 说明:<br> 检索或设置对象与其最近一个具有定位设置的父对象底边相关的位置。<br> 此属性仅仅在对象的定位( position )属性被设置时可用。否则,此属性设置会被忽略。<br> 此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。<br> 对应的脚本特性为 bottom 。其值为一字符串,所以不可用于脚本(Scripts)中的计算。请使用 style 对象的 posBottom , pixelBottom 等运行时特性。 <br> 示例: <br>div { position: absolute; bottom: 1in; }<br> div { position:relative; bottom:6px; } <br> ==left== 语法:left : auto | length <br> 取值:<br> auto : 默认值。无特殊定位,根据HTML定位规则在文档流中分配 <br> length : 由浮点数字和单位标识符组成的长度值 | 百分数。必须定义 position 属性值为 absolute 或者 relative 此取值方可生效。<br> 说明:<br> 检索或设置对象与其最近一个具有定位设置的父对象左边相关的位置。<br> 此属性仅仅在对象的定位( position )属性被设置时可用。否则,此属性设置会被忽略。<br> 此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。<br> 对应的脚本特性为 left 。其值为一字符串,所以不可用于脚本(Scripts)中的计算。请使用 style 对象的 posLeft , pixelLeft 等运行时特性,以及对象的offsetLeft 等特性。 <br> 示例:<br> div { position: absolute; left: 1in; }<br> div { position:relative; top:-3px; left:6px; } [[category:CSS学习教程]]
摘要:
请注意,您对站长百科的所有贡献都可能被其他贡献者编辑,修改或删除。如果您不希望您的文字被任意修改和再散布,请不要提交。
您同时也要向我们保证您所提交的内容是您自己所作,或得自一个不受版权保护或相似自由的来源(参阅
Wordpress-mediawiki:版权
的细节)。
未经许可,请勿提交受版权保护的作品!
取消
编辑帮助
(在新窗口中打开)
本页使用的模板:
模板:开发语言导航
(
编辑
)