寫乙個頁面的時候，我們如果沒有規定元素的內外邊距，瀏覽器就會使用預設樣式。
我們一般不用這個預設格式，所以就用css中的通配選擇器去掉這個預設格式。
*
盒模型分成內容區、內邊距 、邊框 、外邊距四個部分
內聯元素不能設定width和height
設定水平內邊距,內聯元素可以設定水平方向的內邊距
垂直方向內邊距，內聯元素可以設定垂直方向內邊距，但是不會影響頁面的布局
為元素設定邊框,內聯元素可以設定邊框，但是垂直的邊框不會影響到頁面的布局
水平外邊距，內聯元素支援水平方向的外邊距
為右邊的元素設定乙個左外邊距
水平方向的相鄰外邊距不會重疊，而是求和
內聯元素不支援垂直外邊距
1: 通過display樣式可以修改元素的型別
可選值：
inline：可以將乙個元素作為內聯元素顯示
block: 可以將乙個元素設定塊元素顯示
inline-block：將乙個元素轉換為行內塊元素
可以使乙個元素既有行內元素的特點又有塊元素的特點，既可以設定寬高，又不會獨佔一行
none: 不顯示元素，並且元素不會在頁面中繼續占有位置
2: visibility可以用來設定元素的隱藏和顯示的狀態
可選值：
visible 預設值，元素缺省會在頁面顯示
hidden 元素會隱藏不顯示
使用 visibility:hidden;隱藏的元素雖然不會在頁面中顯示，
但是它的位置會依然保持
子元素預設是存在于父元素的內容區中，理論上講子元素的最大可以等於父元素內容區大小
如果子元素的大小超過了父元素的內容區，則超過的大小會在父元素以外的位置顯示
超出父元素的內容，我們稱為溢位的內容
父元素預設是將溢位內容，在父元素外邊顯示
通過overflow可以設定父元素如何處理溢位內容：
可選值：
- visible，預設值，不會對溢位內容做處理，元素會在父元素以外的位置顯示
- hidden, 溢位的內容，會被修剪，不會顯示
- scroll, 會為父元素新增滾動條，通過拖動滾動條來檢視完整內容
- 該屬性不論內容是否溢位，都會新增水平和垂直雙方向的滾動條
- auto，會根據需求自動新增滾動條，需要水平就新增水平，需要垂直就新增垂直，都不需要就都不加
元素在文件流中的特點
塊元素1.塊元素在文件流中會獨佔一行，塊元素會自上向下排列
2.塊元素在文件流中預設寬度是父元素的100%
3.塊元素在文件流中的高度預設被內容撐開
內聯元素
1.內聯元素在文件流中只佔自身的大小，會預設從左向右排列，如果一行中不足以容納所有的內聯元素，則換到下一行，繼續自左向右。
2.在文件流中，內聯元素的寬度和高度預設都被內容撐開
float可以使元素脫離文件流，什麼叫脫離文件流呢？當元素在文件流中時，它會按從左到右，從上到下排列。元素脫離文件流時，就不受文件流的管理，這個標籤在文件流中的位置也被清除掉了。
塊元素在文件流中預設垂直排列，所以這個三個div自上至下依次排開
如果希望塊元素在頁面中水平排列，可以使塊元素脫離文件流
使用float來使元素浮動，從而脫離文件流
可選值：
none，預設值，元素預設在文件流中排列
left，元素會立即脫離文件流，向頁面的左側浮動
right，元素會立即脫離文件流，向頁面的右側浮動
當為乙個元素設定浮動以後（float屬性是乙個非none的值），元素會立即脫離文件流，元素脫離文件流以後，它下邊的元素會立即向上移動
元素浮動以後，會盡量向頁面的左上或這是右上漂浮，直到遇到父元素的邊框或者其他的浮動元素
如果浮動元素上邊是乙個沒有浮動的塊元素，則浮動元素不會超過塊元素
當內聯元素脫離文件流時，它就會變成塊元素。
下節講浮動的元素對未設定高的父元素的影響，又稱高度塌陷。。
HTML和CSS中一些有趣的
要想一行文字在盒子中垂直居中只需要設定這行行高等於盒子高度line height 27px left 0 top 0 position absolute left 50 margin left 寬度的一半px 使用定位流讓居中 父元素必須設定text align center 網頁自動重新整理 文章...
CSS3中關於background一些屬性及連寫
background image 它允許為背景新增乙個或者乙個漸變顏色 這裡注意漸變色屬於image 而不是color 下面我們寫乙個漸變色的div看看實際用法 main 關於image的用法很簡單 主要講解一下漸變中的引數 第乙個為角度 與我們數學中的x y 軸方向相同 0度則為y軸正方向所以漸變...
css和html的一些使用心得
開始學習前端的一些東西做乙個記錄，現在學習了有半個月，在這裡把自己的一些使用心得寫在這裡防止自己忘記，如果有小夥伴一起學習的話也能對大家有一些啟發。在這裡推薦使用vs code 作為編輯器。裡面有一些非常好用的外掛程式，像是live server，vs code icon，還有就是學渣專用的chin...