css學習 css常見屬性用法

2022-05-15 20:05:37 字數 1162 閱讀 8158

1、元素的顯示模式

a、被動轉換:浮動、絕對定位、固定定位(轉換為行內塊元素特性的模式---不設定寬度時,模式換行為行內塊模式後寬度是內容寬度。)

b、主動轉換:display:block  / inline-block

displsy:none(隱藏元素,不保留位置)

display:block(顯示元素和塊級元素顯示模式的意思)

display:inline-block(轉換成行內塊模式)

visiblity:hidden(隱藏元素,位置仍然保留)

visiblity:visible(顯示元素)

一般情況下都是用display不是visiblity

2、居中

盒子居中:設定寬度後  再設定:margin:0 auto;

盒子中文字居中: text-align:center;

3、定位:子絕父相

4、滑鼠hover效果---不同用法

div:hover  滑鼠經過div時,div顯示出來。

div:hover  img

5、overflow   溢位

6、href、src是什麼標籤裡的屬性

(a、link標籤------href)

(img、script標籤------src)

7、當前元素樣式常用寫法

eg:li.current

8、記住:浮動元素要搭配標準流元素使用(絕對定位、固定定位除外)

9、高度剩餘法(因為文字預設左上角對齊,比起padding、margin優先考慮)

一般間隔不是非得用padding、margin解決的可以用高度解決

10、盒子脫離文件流後margin:0 auto 不生效

11、dl>dt+dd用來布局

12、塊級元素不設定寬度時,預設寬度為父元素100%,此時設定padding時父元素不會出現滾動條。

13、影子box-shadow是不佔位置的

14、nth-child() 用法

15、父元素沒給高度而子元素全浮動後要清除浮動。

16、行高:自己量一下

line-height:18px;

17、單行文字垂直居中(設定line-height等於高度)

height:18px;

line-height:18px;

18、字型顏色、大小、行高會繼承

CSS常見屬性

快捷鍵 快捷鍵 數字取值 快捷鍵 注意點 如果設定的字型不存在,而我們又不想用預設的字型來顯示怎麼辦?如果想給中文和英文分別單獨設定字型,怎麼辦?注意點 如果想給介面中的英文單獨設定字型,那麼英文的字型必須寫在中文的前面 補充在企業開發中最常見的字型有以下幾個 還需要知道一點,就是並不是名稱是英文就...

css常見屬性

1.border 邊框樣式 border 邊框的寬度 邊框的樣子 邊框顏色 單位是px double 雙線邊框 英文單詞red,blue solid 實線邊框 rgb 比如 ff0000 2.width 寬度 單位px height 高度 單位px 3.color 內容的顏色 英文單詞red,blu...

css常見屬性

1.border 邊框樣式 border 邊框的寬度 邊框的樣子 邊框顏色 單位是px double 雙線邊框 英文單詞red,blue solid 實線邊框 rgb 比如 ff0000 2.width 寬度 單位px height 高度 單位px 3.color 內容的顏色 英文單詞red,blu...