建站
咨詢(xún)
售后
建站咨詢(xún)
新聞中心
這篇文章主要講解了“CSS中Position屬性的功能”，文中的講解內(nèi)容簡(jiǎn)單清晰，易于學(xué)習(xí)與理解，下面請(qǐng)大家跟著小編的思路慢慢深入，一起來(lái)研究和學(xué)習(xí)“CSS中Position屬性的功能”吧！
position定位類(lèi)型
定位元素（positionedelement）是其計(jì)算后位置屬性為relative,absolute,fixed或sticky的一個(gè)元素。
相對(duì)定位元素（relativelypositionedelement）是計(jì)算后位置屬性為relative的元素。
絕對(duì)定位元素（absolutelypositionedelement）是計(jì)算后位置屬性為absolute或fixed的元素。
粘性定位元素（stickilypositionedelement）是計(jì)算后位置屬性為sticky的元素。
大多數(shù)情況下，height和width被設(shè)定為auto的絕對(duì)定位元素，按其內(nèi)容大小調(diào)整尺寸。但是，被絕對(duì)定位的元素可以通過(guò)指定top和bottom，保留height未指定（即auto），來(lái)填充可用的垂直空間。它們同樣可以通過(guò)指定left和right并將width指定為auto來(lái)填充可用的水平空間。
除了剛剛描述的情況（絕對(duì)定位元素填充可用空間）：
如果top和bottom都被指定（嚴(yán)格來(lái)說(shuō)，這里指定的值不能為auto），top優(yōu)先。
如果指定了left和right，當(dāng)direction設(shè)置為ltr（水平書(shū)寫(xiě)的中文、英語(yǔ)）時(shí)left優(yōu)先，當(dāng)direction設(shè)置為rtl（阿拉伯語(yǔ)、希伯來(lái)語(yǔ)、波斯語(yǔ)由右向左書(shū)寫(xiě)）時(shí)right優(yōu)先。
position語(yǔ)法
position屬性被指定為從下面的值列表中選擇的單個(gè)關(guān)鍵字。
取值
static
該關(guān)鍵字指定元素使用正常的布局行為，即元素在文檔常規(guī)流中當(dāng)前的布局位置。此時(shí)top,right,bottom,left和z-index屬性無(wú)效。
relative
該關(guān)鍵字下，元素先放置在未添加定位時(shí)的位置，再在不改變頁(yè)面布局的前提下調(diào)整元素位置（因此會(huì)在此元素未添加定位時(shí)所在位置留下空白）。position:relative對(duì)table-*-group,table-row,table-column,table-cell,table-caption元素?zé)o效。
absolute
不為元素預(yù)留空間，通過(guò)指定元素相對(duì)于最近的非static定位祖先元素的偏移，來(lái)確定元素位置。絕對(duì)定位的元素可以設(shè)置外邊距（margins），且不會(huì)與其他邊距合并。
感謝各位的閱讀，以上就是“CSS中Position屬性的功能”的內(nèi)容了，經(jīng)過(guò)本文的學(xué)習(xí)后，相信大家對(duì)CSS中Position屬性的功能這一問(wèn)題有了更深刻的體會(huì)，具體使用情況還需要大家實(shí)踐驗(yàn)證。這里是創(chuàng)新互聯(lián)網(wǎng)站建設(shè)公司，，小編將為大家推送更多相關(guān)知識(shí)點(diǎn)的文章，歡迎關(guān)注！
本文名稱(chēng)：CSS中Position屬性的功能-創(chuàng)新互聯(lián)
本文路徑：http://fisionsoft.com.cn/article/ceephd.html
