html+css的瑣碎問題-有解無憂

總結

行內元素、塊元素、行內塊元素都有什么？特點是什么

塊級元素、行內元素和行內塊元素如何轉換、有何特點
1. 塊級元素（div，p，h1~h6，ol，ul…）
  - 獨占一行；
  - 寬度、高度、行高及頂部和底部邊距都可以設定；
  - 元素寬度再不設定的情況下，和它的父元素的寬度一致，
2. 行內元素（span，br，a，em，b，i…）
  - 和其他元素都在一行上；
  - 元素的寬度、高度及頂部和頂部邊距都不能設定，
  - 元素的寬度就是它所包含的文字或圖片的寬度，不可修改，
3. 行內塊元素（img，input，td）
  - 和其他元素都在一行上
  - 元素的寬度、高度、行高及頂部和底部邊距都可以設定
幾行幾列的表格，合并

表格詳情在2.2跟2.3
1. tr表示行，td表示單元格，th表示表格內的表頭單元格
2. 合并行rowspan，合并列colspan
表單（input）標簽型別有什么，

input標簽型別有哪些
1. 單選radio
2. 復選checkbox
3. 文本域textarea （不是input標簽里的型別，也放這記錄了下）
選擇器都有什么？優先級怎么算，權重怎么算

選擇器都有哪些？

優先級跟權重計算
1. 交集選擇器（標簽緊挨著id或者類）
2. 并集選擇器（，號）
3. 兄弟選擇器（+號）
4. 子元素選擇器（>號）
5. 后代選擇器（空格）等
6. 優先級跟權重在上面鏈接中
屬性（文字、顏色、寬高、內邊距、外邊距）

基礎單詞

內邊距詳情

文字類的單詞
1. color：文字顏色
2. width：寬
3. height：高
4. padding：內邊距
5. margin：外邊距
背景顏色，背景圖，平鋪 no-repeat

背景屬性
1. background-color:背景顏色
2. background-repeat：平鋪等
盒模型的計算方式，盒子是由哪些組成的？margin、padding幾個值都是什么意思

盒模型計算
1. margin：10px 20px 30px 40px
  - 上外邊距10px 右外邊距20px 下外邊距30px 左外邊距40px
2. padding：50px 60px 70px 80px
  - 上內邊距50px 右內邊距60px 下內外邊距70px 左內邊距80px
margin合并，margin塌陷，解釋，解決

合并及塌陷問題
- 合并：兩個上下垂直的盒子，上盒子設下margin，下盒子設上margin
- 塌陷：父子關系，子盒子設定上margin，子跟父會一起塌陷
  1. padding
  2. 父盒子設定邊框
  3. 父盒子overflow:hidden;
浮動：浮動影響，為什么清浮動？怎么清浮動

浮動
1. 布局的時候，小盒子在標準流，一浮動，父盒子高為0，影響下面盒子布局
2. 在浮動元素后面加空標簽，加clear: both;
3. 給父元素設高
4. 給父元素設overflow:hidden
5. 偽元素清浮動 before，after
定位：有幾種模式，參照點是哪里，特性

定位
1. 絕對：距離他最近的有定位的父元素
2. 相對：相對他自身原來的位置
3. 固定：頁面、瀏覽器
display都有什么值
1. none inline block inline-block
a:link點擊前 a:visit點擊后 a:hover點擊時 a:active選定鏈接

a標簽偽類選擇器
css3都有什么屬性 box-shadow border-radius transition，transform text-shadow

CSS3新增屬性
下拉選單：select option

轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/113306.html

標籤：其他

上一篇：選擇器

下一篇：原生JS實作一個簡單的打字小游戲

html+css的瑣碎問題

總結

行內元素、塊元素、行內塊元素都有什么？特點是什么

幾行幾列的表格，合并

表單（input）標簽型別有什么，

選擇器都有什么？優先級怎么算，權重怎么算

屬性（文字、顏色、寬高、內邊距、外邊距）

背景顏色，背景圖，平鋪 no-repeat

盒模型的計算方式，盒子是由哪些組成的？margin、padding幾個值都是什么意思

margin合并，margin塌陷，解釋，解決

浮動：浮動影響，為什么清浮動？怎么清浮動

定位：有幾種模式，參照點是哪里，特性

display都有什么值

a:link點擊前 a:visit點擊后 a:hover點擊時 a:active選定鏈接

css3都有什么屬性 box-shadow border-radius transition，transform text-shadow

下拉選單：select option