在布局中經(jīng)常用到的還有position元素定位
該屬性有以下值
static?默認值粘都,采用元素默認的定位方式幸斥。
relative使元素對其原始位置進行“相對定位”姆泻。移動相對定位元素身诺,但它原本所占的空間不會改變锭环。
absolute使元素根據(jù)父(祖先)父元素的定位情況進行“絕對定位”利花。absolute 定位使元素的位置與文檔流無關科侈,因此不占據(jù)空間。
absolute 定位的元素和其他元素重疊炒事。
fixed使元素相對于瀏覽器窗口進行“固定定位”臀栈。即元素的位置相對于瀏覽器窗口是固定位置,即使窗口是滾動的它也不會移動
sticky屬性英文字面意思是粘挠乳,粘貼权薯,所以可以把它稱之為粘性定位。position: sticky;?基于用戶的滾動位置來定位睡扬。?
粘性定位的元素是依賴于用戶的滾動盟蚣,在?position:relative?與?position:fixed?定位之間切換。
它的行為就像?position:relative;?而當頁面滾動超出目標區(qū)域時卖怜,它的表現(xiàn)就像?position:fixed;屎开,它會固定在目標位置。
元素定位表現(xiàn)為在跨越特定閾值前為相對定位韧涨,之后為固定定位牍戚。
這個特定閾值指的是 top, right, bottom 或 left 之一侮繁,換言之,指定 top, right, bottom 或 left 四個閾值其中之一如孝,才可使粘性定位生效宪哩。否則其行為與相對定位相同。
今天學習了字體圖標庫的用法第晰,有兩個常用網(wǎng)站锁孟,他們都是用來插入各種圖標,用法根據(jù)提示即可茁瘦。
Font-awesome: http://fontawesome.dashgame.com/?
阿里云圖標:http://iconfont.cn/?
阿里云可通過三種不同的方式插入圖標品抽。
最后預習明日內(nèi)容,修改布局作業(yè)