?
本文檔使用 php中文網(wǎng)手冊(cè) 發(fā)布
語(yǔ)法:
bottom: auto | <length> | <percentage>
默認(rèn)值:auto
適用于:定位元素。即定義了 <' position '> 為「非static」的元素
繼承性:無(wú)
動(dòng)畫性:當(dāng)值為<length> | <percentage>時(shí)
計(jì)算值:當(dāng)position為static時(shí),計(jì)算值是auto。
為relative時(shí),如果top和bottom都是auto,則它們的計(jì)算值是0;如果top和bottom其中一個(gè)為auto,則auto相當(dāng)于另一個(gè)的負(fù)值,即top = -bottom;如果top和bottom的值都不為auto,則忽略bottom。
否則在其它情況下,當(dāng)指定值為<length>時(shí),計(jì)算值為指定值,當(dāng)指定值為<percentage>時(shí),計(jì)算值為計(jì)算后的絕對(duì)值。除去這些情況,都為auto
媒體:視覺(jué)
取值:
auto:無(wú)特殊定位,根據(jù)HTML定位規(guī)則在文檔流中分配
<length>:用長(zhǎng)度值來(lái)定義距離底部的偏移量。可以為負(fù)值。
<percentage>:用百分比來(lái)定義距離底部的偏移量。百分比參照包含塊的高度。可以為負(fù)值。
說(shuō)明:
檢索或設(shè)置對(duì)象參照相對(duì)物底邊界向上偏移位置。
該屬性用來(lái)指定盒子參照相對(duì)物底邊界向上偏移。相對(duì)定位元素的相對(duì)物是自身,絕對(duì)定位和居中定位元素是從包含塊的padding邊界開(kāi)始計(jì)算偏移值
對(duì)應(yīng)的腳本特性為bottom。
兼容性:
在IE6及以前的版本下,如果top和bottom都定義了非auto的值,那么 bottom 的計(jì)算值將會(huì)被設(shè)置為 -top (無(wú)論是否顯式的定義了 height 或 max-height),它的指定值將被忽略,說(shuō)白了,你將無(wú)法在不指定某個(gè)元素高度的情況,通過(guò)給元素指定top和bottom的方式來(lái)進(jìn)行高度拉伸;
示例:
<!DOCTYPE html> <html lang="zh-cmn-Hans"> <head> <meta charset="utf-8" /> <title>bottom_CSS參考手冊(cè)_web前端開(kāi)發(fā)參考手冊(cè)系列</title> <meta name="author" content="Joy Du(飄零霧雨), dooyoe@gmail.com, www.doyoe.com" /> <style> .test { position: absolute; bottom: 0; width: 200px; height: 200px; padding: 5px 10px; background: #c00; color: #fff; line-height: 12; } </style> </head> <body> <div class="test">我將出現(xiàn)在瀏覽器底部</div> </body> </html>
點(diǎn)擊 "運(yùn)行實(shí)例" 按鈕查看在線實(shí)例