整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
、css樣式的繼承性:
作用：給父元素設置一些屬性，子元素也可以使用
應用場景：
一般用于設置網頁上的一些共性信息，例如網頁的文字顏色，字體，文字大小等內容。優化代碼，降低工作量
注意點：
1.并不是所有的屬性都可以繼承，、
只有color/font-/text-/ line開頭的屬性才能繼承；
2.在css的繼承中，不僅僅是兒子可以繼承，只要是后代
都能繼承
3.繼承性中的特殊性
3.1 a標簽的文字和顏色 和下劃線是不能繼承父元素的——舉例：
復制代碼
<style type="text/css">
div{
color:red
font-size:24px;
text-decoration: none;
}
</style>
<body>
< div>
<h1>我是大標題</h1>
<a heref="#">我是超鏈接</a>
<p>我是段落</p>
</div>
（上面的代碼，只有p繼承了div設置的屬性，而a標簽是不能繼承父元素的屬性,顏色不會變紅，下劃線也不會被去掉）
復制代碼
3.2 h標簽的文字大小也是不能繼承父元素的(見上面代碼，<h1>標簽中我是大標題不會繼承<div>的 font-size:24px;屬性，所以需要給<h1>單獨寫個css樣式：h1{font-size:24px;}
應用場景：
一般用于設置網頁上的一些共性信息，例如網頁的文字顏色，
字體，文字大小燈內容
格式：
body{屬性：值;}
二、層疊性
比如p標簽，給p標簽設置id和class類名，選擇器上選擇p 和p的id或者class類名，設置相同的屬性，就是層疊性
三、優先級：（三一）
作用：當多個選擇器（比如選擇p標簽和p標簽里設置的id或者class昵稱），選中同一個標簽，并且給同一個標簽設置相同的屬性時，
如何層疊就優先級來確定。
2.優先級判斷的三種方式
2.1 是否直接選中，直接選中指的是直接選中要設置css樣式的標簽，和標簽的id或者class類名。（間接選中就是指的是繼承性，比如選擇<ul>那里面的li繼承ul的屬性，就稱為繼承屬性）
如果是間接選中，誰離目標標簽比較近就聽誰的。
2.2是否是相同的選擇器。
如果是相同選擇器，那么就是誰寫在后面就聽誰的。（比如給兩個p標簽設置css樣式
p{color:blue}
p{color:red｝
那么就會以第二個p為標準，文字變成紅色
2.3不同的選擇器
如果都是直接選中，并且不是相同類型的選擇器，那么就會按照
選擇器的優先級來層疊
id>類>標簽>通配符>繼承>瀏覽器默認
權重計算
如果選擇器里有直接選中和間接選中。哪怕是間接的選擇器為id選擇器，也會優先實行直接選中的效果。
我是一名前端開發程序員，自己整理了一份2019最全面前端學習資料，從最基礎的HTML+CSS+JS到移動端HTML5到各種框架都有整理，送給每一位前端小伙伴，這里是小白聚集地，歡迎初學和進階中的小伙伴
前端資料獲取方式：
1.在你手機的右上角有【關注】選項，點擊關注！
2.關注后，手機客戶端點擊我的主頁面，右上角有私信，請私信回復：【學習】
電腦已經設置好了關鍵詞自動回復，所以回復的時候請注意關鍵詞喲~
一、先創建一個html文件，記得添加vue庫文件。
二、創建一盒容器vmdiv，用vue綁定它，測試vue綁定后的插入值text1效果。
三、加入文本框和兩個按鈕。
四、通過flex排序，讓它們三個豎排。比例為文本框占4，按鈕占1。
五、測試一下按鈕的點擊事件。
六、給文本框添加style樣式，給它字體大小為16px，并設置一個變量size，讓它來控制字的大小，通過點擊后，字變大加5，變小減5。
SS樣式優先權
1.寫法優先權
優先級依次是：行內樣式表 > 內部樣式表> 外部樣式表。
2.選擇符優先權
對于id 與 class 而言，id的定義優先于class 的定義。具有class屬性的比沒有class屬性的優先權要大。
id > class > 類型選擇符
樣式繼承
1.HTML 中的子標簽會繼承部分父標簽的樣式。
如: body { color:#ff0000;}那么頁面中,body之下的所有標簽及標簽下的所有子標簽的文本都將變成紅色。
2. !important
在兩行相同類型的css樣式定義中，往往優先執行后面一個;
p{font-size:14px;font-size:20px;}
但是可以通過!important 語法，提升某一句樣式表的重要性，使及優先執先 !important標注的語句。
p{font-size:14px !important;font-size:20px;}
css 代碼注釋，以 /* 開始 */ 結束。
如：/* body樣式*/
body { margin:0px; padding:0px;}
/*LOGO樣式*/
#logo{ ……}
/*導航樣式結束*/
字體樣式
1.字體
font-family設置文字名稱，可以使用多個名稱，或者使用逗號
分隔，瀏覽器則按照先后順序依次使用可用字體。
例：Arial
p { font-family:'宋體'，'黑體'}
2.字號
font-size設置文字的尺寸
例：p { font-size:14px;}
3.字體加粗
font-weight : normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900
例：p { font-weight:bold;}
4.斜體
font-style : normal | italic | oblique
例：p { font-style: normal; }
p { font-style: italic; }
p { font-style: oblique; }
5.下劃線控制
text-decoration : none || underline || blink || overline || line-through
例：
p { text-decoration:overline;}
p { text-decoration:underline;}
p { text-decoration:line-through;}
6.字體樣式縮寫
font : font-style || font-variant || font-weight || font-size || line-height || font-family
例：
P {
font-style:italic;
font-weight:bold;
font-size:14px;
line-height:22px;
font-family:宋體;
}
也可以縮寫的形式：
p { font:italic bold 14px/22px 宋體}
1.行高
line-height : normal | length
例：p{ line-height:25px;} p{ line-height:150%}
2.段落縮進
text-indent : length; p{ text-indent:4px;}
3.段落對齊
text-align : left | right | center | justify
對于text-aligh,不但是文本，對象中的其它元素也能夠被text-align進行對齊方式的設置。
例：
p { text-align:right;}
p { text-align:center;}
4.文字間距
letter-spacing : normal | length
p{ letter-spacing:5px;}
關于margin外邊距和padding內邊距會在下一章中講到。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
