CSS的一些使用

2021-10-05 09:47:28 字數 1928 閱讀 7694

>

a:link

a:visited

a:hover

style

>

表單 :focus 獲得焦點

>

input:focus

style

>

列表的每一項 :first-child / :last-child / nth-child (number)

>

ul li:first-child

ul li:last-child

ul li:nth-child(4)

style

>

​ ! important (10000) > 內聯樣式 (1000) > id選擇器 (100) > 類、偽類選擇器 (10) > 標籤選擇器 (1)

浮動就是讓塊級標籤不獨佔一行。脫離文件流,不占用標準流。

目的:把塊級標籤元素可以排列在一行上。

float的屬性值:

left左浮動

right右浮動

none不浮動(預設值)

>

.box1

.box2

style

>

--------------

浮動後,之後的元素(塊級或是行級)不會顯示在下一行。

設定元素在文件中的位置,會將標籤轉換為塊級元素

static:靜態定位

預設值,沒有定位,不能設定偏移值(left / top / right / bottom),占用標準流(文件流)

relative:相對定位

占用標準流(文件流),出現在文件中該出現的位置,可通過偏移值修改位置,相對於自己做偏移,偏移後仍會佔據原來的位置

absolute:絕對定位

脫離文件流,相對於body偏移,偏移後原位置會被侵占

一般與相對定位結合使用,此時相對的是relative定義的父級元素做偏移

eg:

class

=>

class

="box1"

>

div>

class

="box2"

>

div>

class

="box3"

>

div>

div>

----------------------------

position: relative;

}----------------------------

.box2

fixed:固定定位

脫離文件流,相對於瀏覽器做偏移,它與父級relative元素沒有關係

一般用於固定導航欄

當多個元素新增絕對位置之後,元素將會疊加在一起,可以用來設定元素顯示的層次

:文件流預設為0,且在static&relative使用無效

z-index: -1;數字小的排在下面

一些css的屬性

一些css的屬性 使整個頁面的元素都沒有頁邊距 margin 與填充距離 padding body 使整個頁面居中顯示 padding 12px 元件能與邊緣的距離 moz border radius 6px 6px 6px 6px 圓角 float left div同行顯示 margin 30px...

css的一些屬性

1 文字的水平居中 css實現單行文字水平居中 text align center 2 塊元素居中 保證margin left和margin right都為auto,就可以保證塊元素水平居中 如果要是使用margin 0 auto來實現塊元素居中,就要 指定這個元素的寬度 3 行內元素 使用text...

CSS的一些特性

text indent 20px 2em 2rem em 相對于父元素字型大小的參考單位 text indent 999 隱藏文字的另外做法層疊性,繼承性 inherit 優先順序 繼承性 text line height,font color color 1.屌絲程式設計師表示法 red,blue...