資訊專(zhuān)欄INFORMATION COLUMN
摘要：內(nèi)聯(lián)元素行內(nèi)元素內(nèi)聯(lián)元素行內(nèi)元素沒(méi)有任何語(yǔ)義，專(zhuān)門(mén)用來(lái)選中文字，然后為文字設(shè)置樣式。內(nèi)聯(lián)元素只占自身大小，不會(huì)占用一行。一般請(qǐng)款告知使用塊蒜素去包含內(nèi)聯(lián)元素，二不會(huì)使用內(nèi)聯(lián)元素去包含塊元素。用戶相同屬性的元素，稱(chēng)為一組元素。
CSS：層疊樣式表
網(wǎng)頁(yè)一層一層的。
而css就可以分別為網(wǎng)頁(yè)的各層設(shè)置樣式。
（內(nèi)聯(lián)樣式）放在元素的style屬性中。給誰(shuí)設(shè)置寫(xiě)在那個(gè)標(biāo)簽里面。
也稱(chēng)為：內(nèi)聯(lián)樣式，只對(duì)當(dāng)前的元素中的內(nèi)容起作用。
內(nèi)聯(lián)樣式不方便復(fù)用，不推薦使用。
內(nèi)聯(lián)樣式屬于結(jié)構(gòu)與表現(xiàn)耦合，不方便后期的維護(hù)，不推薦使用。
鋤禾日當(dāng)午，旱地和嚇唬
（內(nèi)部樣式）將css樣式編寫(xiě)在head中的style標(biāo)簽里,然后通過(guò)css選擇器選擇指定元素，然后可以同時(shí)為這些元素一起設(shè)置樣式，這樣可以使樣式進(jìn)一步的復(fù)用。
將樣式表編寫(xiě)到style標(biāo)簽中，也可以使表現(xiàn)和結(jié)構(gòu)進(jìn)一步分類(lèi)，使表現(xiàn)和結(jié)構(gòu)進(jìn)一步分離，推薦使用方式。
（外部樣式）表
將樣式表編寫(xiě)到外部的css文件中。
編寫(xiě)外部樣式css文件
引入外部css樣式文件到當(dāng)前html中。
CSS入門(mén)
鋤禾日當(dāng)午，旱地和嚇唬
創(chuàng)建明月光，疑似地上霜
/*
注釋內(nèi)容
*/通過(guò)選擇器可以選中頁(yè)面中指定的元素，并且將聲明塊中的樣式應(yīng)用到選擇器對(duì)應(yīng)的元素上。
聲明塊緊跟在選擇器的后邊，使用對(duì){}括起來(lái)，聲明塊中實(shí)際上就是一組一組的明值對(duì)結(jié)構(gòu)，這一組一組的明值對(duì)我們稱(chēng)為聲明。
在一個(gè)聲明塊中可以寫(xiě)多個(gè)聲明，多個(gè)聲明之間使用;隔開(kāi)。聲明的樣式名和樣式值之間使用：來(lái)連接
p{
color:red;
font-size:100px;
}推薦使用的開(kāi)發(fā)工具，見(jiàn)官網(wǎng)文檔。
one div
two divdiv、p、h1、h2、h3.。。。
span：沒(méi)有任何語(yǔ)義，專(zhuān)門(mén)用來(lái)選中文字，然后為文字設(shè)置樣式。
內(nèi)聯(lián)元素：只占自身大小，不會(huì)占用一行。
a、img、span、iframe
塊元素：主要用來(lái)布局。
內(nèi)聯(lián)元素：主要用來(lái)選中文本，設(shè)置文本樣式。
一般請(qǐng)款告知使用塊蒜素去包含內(nèi)聯(lián)元素，二不會(huì)使用內(nèi)聯(lián)元素去包含塊元素。
，但是除了它本身。
元素(標(biāo)簽)選擇器
作用：可以選擇頁(yè)面中的所有指定元素。
p{
color:red;
font-size:100px;
}id選擇器
通過(guò)元素的id屬性值選中唯一的一個(gè)元素。
語(yǔ)法：
#p1{
color: green;
font-size: 300px;
}類(lèi)選擇器
可以為元素設(shè)置class屬性，class屬性和id屬性類(lèi)似，只不過(guò)class屬性可以重復(fù)。
用戶相同class屬性的元素，稱(chēng)為一組元素。
通過(guò)元素的class屬性，選中一組元素。
css03
ggggg
ggggg
ggggg
ggggg
ggggg
class可以同時(shí)為一個(gè)元素設(shè)置多個(gè)class屬性值，多個(gè)值之間用空格隔開(kāi)。
選擇器分組
通過(guò)選擇器分組可以同時(shí)選中多個(gè)選擇器對(duì)應(yīng)的元素。
語(yǔ)法：選擇器1，選擇器2，選中N{}
css03
fd
fdfd
ggggg
ggggg
ggggg
ggggg
通配選擇器
可以用來(lái)選中頁(yè)面中的所有元素
*{
color:red;
font-size: 90px;
}作用：可以選中同時(shí)滿足多個(gè)選擇器的元素
span.p3{
color: #00008B;
}span與p3中間沒(méi)有空格。
對(duì)id選擇器來(lái)說(shuō)，不建議使用復(fù)合選擇器。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/1652.html
摘要：現(xiàn)在回到我們這一章節(jié)的標(biāo)題，將它做下補(bǔ)充關(guān)于那些事四之基于構(gòu)架基礎(chǔ)樣式庫(kù)基礎(chǔ)庫(kù)構(gòu)思為什么要做基礎(chǔ)庫(kù)我上一章節(jié)的末尾拋出了幾個(gè)問(wèn)題假設(shè)你要做一個(gè)游戲單頁(yè)面，網(wǎng)頁(yè)上并不存在表單內(nèi)容，那么你就要移除一些冗余的代碼，開(kāi)始自定義樣式來(lái)滿足自己的需求。 前言 先來(lái)回顧一下前幾章節(jié)，我們都說(shuō)了哪些內(nèi)容： CSS Reset 歷史 與 Normalize.css 介紹 Normalize.css...
摘要：現(xiàn)在回到我們這一章節(jié)的標(biāo)題，將它做下補(bǔ)充關(guān)于那些事四之基于構(gòu)架基礎(chǔ)樣式庫(kù)基礎(chǔ)庫(kù)構(gòu)思為什么要做基礎(chǔ)庫(kù)我上一章節(jié)的末尾拋出了幾個(gè)問(wèn)題假設(shè)你要做一個(gè)游戲單頁(yè)面，網(wǎng)頁(yè)上并不存在表單內(nèi)容，那么你就要移除一些冗余的代碼，開(kāi)始自定義樣式來(lái)滿足自己的需求。 前言 先來(lái)回顧一下前幾章節(jié)，我們都說(shuō)了哪些內(nèi)容： CSS Reset 歷史 與 Normalize.css 介紹 Normalize.css...
摘要：派生選擇器依據(jù)元素的位置關(guān)系來(lái)定義樣式。稱(chēng)其為上下文選擇器，稱(chēng)其為派生選擇器。在現(xiàn)在布局中，選擇器常常用于建立派生選擇器。和一樣，也可被用作派生選擇器。 文章大綱來(lái)源：【Day 3】HTML復(fù)習(xí) + CSS基礎(chǔ) 初識(shí)CSS 入門(mén)CSS 初識(shí)CSS 層疊樣式表（Cascading Style Sheets），即前端常說(shuō)的CSS。 內(nèi)容引用：CSS 簡(jiǎn)介 樣式解決了什么問(wèn)題？ HTML...
摘要：派生選擇器依據(jù)元素的位置關(guān)系來(lái)定義樣式。稱(chēng)其為上下文選擇器，稱(chēng)其為派生選擇器。在現(xiàn)在布局中，選擇器常常用于建立派生選擇器。和一樣，也可被用作派生選擇器。 文章大綱來(lái)源：【Day 3】HTML復(fù)習(xí) + CSS基礎(chǔ) 初識(shí)CSS 入門(mén)CSS 初識(shí)CSS 層疊樣式表（Cascading Style Sheets），即前端常說(shuō)的CSS。 內(nèi)容引用：CSS 簡(jiǎn)介 樣式解決了什么問(wèn)題？ HTML...
摘要：基礎(chǔ)基礎(chǔ)是一種標(biāo)記語(yǔ)言，不是編程語(yǔ)言，需要明確這點(diǎn)。元素標(biāo)簽內(nèi)容基礎(chǔ)基礎(chǔ)負(fù)責(zé)文本樣式的呈現(xiàn)，既然將和分離開(kāi)，各自只負(fù)責(zé)各自的職責(zé)，那么肯定需要某種方式將兩者連接在一起。 本篇文章已授權(quán)微信公眾號(hào) dasu_Android（大蘇）獨(dú)家發(fā)布 聲明 本系列文章內(nèi)容全部梳理自以下四個(gè)來(lái)源： 《HTML5權(quán)威指南》 《JavaScript權(quán)威指南》 MDN web docs Github:smyh...
閱讀 1834·2019-08-30 15:55
閱讀 1034·2019-08-26 11:57
閱讀 540·2019-08-26 11:29
閱讀 3378·2019-08-26 10:49
閱讀 1931·2019-08-23 18:40
閱讀 1837·2019-08-23 16:04
閱讀 3124·2019-08-23 11:01
閱讀 2299·2019-08-23 10:56
