CSS定位走一波(定位學習續)

2021-07-31 02:56:06 字數 1440 閱讀 7269

又是新的一周過去了,時間到了,春天綠了,關於html5的學習進步了,今天部落格更新一些css定位的內容,小的一些細節也要牢記,方便做乙個更完美的專案。

如何讓垂直方向居中,解決方式

:在父元素新增overflow:hidden

為父盒子新增border

為父盒子新增border

上下兩個併排內容塊的安排,最好只設定其中每個塊上或下margin的一處即可

css

的box-sizing

content-box:採用標準模式解析計算,也是預設模式

border-box:將採用怪異模式解析計算

採用相對定位的元素,會相對於它原來的位置進行定位並且,元素原始占用的空間不會被其他元素占用

採用絕對定位的元素,會尋找離它最近的採用了定位的父元素,並以它為座標進行定位。如果所有的父元素都沒有使用定位,則以body為座標進行定位。並且,元素占用的空間會被其他元素占用

css中的文件機制

普通文件流

浮動定位

除非專門指定,否則所有框都在普通流中定位。

塊級框從上到下乙個接乙個地排列。

css

定位屬性

position

static

relative

absolute

fixed

css

其他定位屬性

topright

bottom

left

z-index

css

相對定位

position

取值為relative

css相對定位是元素與元素原來的位置

css相對定位元素仍佔據原來的空間

css

絕對定位

position

取值為absolute

css絕對定位的元素是相對最近的已經定位的祖先元素,如果沒有定位的祖先元素,那麼相對於初始包含塊(body)

css

固定定位

position

取值為fixed

css負邊距是布局中常用的技巧,合理的運用會有意想不到的效果

垂直居中

=絕對定位

+負邊距

負邊距會增加元素的寬度,該元素會省略寬度

並集選擇器

#left,#center,#right

水平排放的盒子,水平間距是margin的累加

垂直排放的值,垂直間距是合併的(取最大值)

基礎走一波 壹

keep it and stupid includeint main 25.000 請按任意鍵繼續.int x 2 int t int main int中最大 0x7fffffff 最小0x80000000 正負20億 考慮浮點誤差。int m floor sqrt n 0.5 lld long l...

CSS定位學習筆記

僅僅是自己對著w3cschool整理的一些 css 基礎知識點,敲一遍加深下印象也方便以後複習。一切皆為框 與之相反,span 和strong 等元素稱為行內元素,這意味著他們的內容顯示在行內,即 行內框 some text some more text.在這種情況下,這個框稱為無名塊框,因為它不與...

CSS學習之 定位

如果,說浮動,關鍵在乙個 浮 字上面,那麼 我們的定位,關鍵在於乙個 位 上。css離不開定位,特別是js特效,天天和定位打交道。那麼定位,最常運用的場景再那裡呢?小黃色塊可以再上移動 元素的定位屬性主要包括定位模式和邊偏移兩部分。1 邊偏移 邊偏移屬性 描述top 頂端偏移量,定義元素相對於其父元...