CSS基礎知識(二)

2021-08-03 20:40:04 字數 1383 閱讀 9641

background-color:背景顏色

background-repeat:的複製選項

repeat:在水平和垂直兩個方向上進行複製

norepeat:不複製

repeat-x:在水平方向上覆制

repeat-y:在垂直方向上覆制

也可以將這些屬性封裝到乙個屬性background中,使**更加簡潔:

書寫按照一定的順序:

background-color(背景色)

background-image(背景)

background-repeat(重複方式)

background-position(位置)

常見的height--高度     width--寬度

而max-width表示最大寬度

max-height表示最大高度

min-width表示最小寬度

min-height表示最小高度

3.顯示的相關屬性

隱藏元素

方法:visibility:hidden;僅僅隱藏內容,該元素所佔的位置依然存在

display:none;不僅隱藏內容,而且不佔位置

例:div

display:可以設定元素的顯示模式

inline-block:將塊級元素以內聯元素形式顯示,同時兼具塊級元素的某些特徵,比如可以使用width和height設定所佔位置大小。

inline:將塊級元素以內聯元素形式顯示,此時width和height屬性無效,起空間取決於元素的內容。li

span

4.盒子模型

盒子模型可以理解為乙個大盒子裡面放著乙個小盒子,而小盒子又不是緊貼著大盒子,之間保留著一些距離。

margin:外邊距

margin-top、margin-right、margin-bottom、margin-left  分別為上、右、下、左的邊距表示

使用方式:

margin:30px;表示上下左右外邊距都是30px;

margin-left:30px;單獨設定上下左右外邊距;

而同時,四種邊距也可以簡寫:

margin: 10px 20px30px 40px;

順序依次是:上右下左

內邊距:padding;和margin類似

border:邊框

broder-width:邊框寬度

broder-style:邊框線條型別

broder-color:邊框的顏色

outline-輪廓線。用法同border

內邊距也可以用簡寫的方式:

border: 4px dashedblue;        

CSS基礎知識整理二

下面是定義乙個盒子的border div下面是定義乙個盒子的寬度,其寬度由padding left padding right margin left margin right border left border right和自己本身物體的寬度組成 div 以上案例中div的寬度為232px 乙個...

CSS 基礎知識

選擇器 元素選擇器 p 後代選擇器 li a id選擇器 intro some text 類選擇器 dateposted 24 3 2006 偽類選擇器 a link 通用選擇器 浮動 定位 框模型 定位的四種模型 相對定位 relative 相對定位的座標原點 該元素在普通流中的位置 特別點 元素...

CSS基礎知識

css規則有兩個主要的部分組成 選擇器,以及一條或者多條宣告h1 css內部的注釋以 開始,以 結束p id選擇器,通過 來選擇html元素 username class選擇器,通過 來選擇一組class元素.center 指定特定的html元素使用classp center 引入外部樣式表 rel...