整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
當web開發還是一項新技術的時候，無論定義網頁內容還是定義網頁樣式，都是使用的HTML語言，HTML的內容和樣式沒有區分開，如古老的HTML樣式：
<H3 COLOR=RED><CENTER>樣式</CENTER></H3>
其中color表示顏色，center讓文字居中，不是目前規范的書寫形式，而且舊的HTML標簽都是大寫的，web開發人員還需要來回切換大小寫，所以很多人認識到了這種開發方式并不理想。
Web開發人員想開發一種新的語言，把表示樣式的代碼從HTML中分離出來，并且創建一種規則來定義HTML標簽要顯示成什么樣子，這門語言叫做CSS，CSS是用來描述HTML標簽應該如何顯示的一個代碼。如：
<h3>樣式</h3>
用CSS可以讓h3標簽顯示成綠色，讓h3字體在大一點，讓h3有一個下劃線，可以統一字體的顯示樣式等。
CSS樣式
CSS的全稱叫做 Cascading Style Sheets 級聯樣式表，CSS的工作方式依賴于"選擇器"可以選擇HTML標簽，并且修改這些標簽的樣子。
選擇器的類型有：
1、類型選擇器：不帶尖括號的標簽名，最簡單的選擇器
類型選擇器
定義了一個P標簽，如果想在CSS中選擇這個標簽，首先寫上字母P，然后選擇要定的屬性如text-decoration，并設置這個屬性的屬性值為underline下劃線，在瀏覽器中這個段落就會顯示下劃線。
類型選擇器
使用選擇器的時候我們必須要遵守選擇器的特殊語法規則：
選擇器名字后面是一個開始的大括號，屬性和屬性值中間是冒號，屬性值后面是分號，這里面任何一部分都不能丟掉，否則CSS無法正常工作，并且要注意標點符號全部是英文半角的，最后在所有的屬性列表后面是一個結束的大括號，大括號的作用就是可以在里面寫很多屬性，如圖：
類型選擇器
顯示結果為帶下劃線的紅色字體段落：
類型選擇器
在CSS中使用標簽名選擇標簽的時候，類型選擇器會作用在所有同名標簽中。所以這里只定義額一CSS樣式，它會作用在所有的P標簽中。
2、派生選擇器
可以讓CSS標簽作用在很小的范圍內，如下圖，只讓CSS作用在li標簽中，所以選擇ul標簽中的li標簽即可。
派生選擇器
3、偽類選擇器
1）在原有選擇器的基礎上添加一個限定條件，當某種情況發生時在選擇這個標簽。如下圖，首先定義個a的類型選擇器，讓頁面中所有的超鏈接下劃線都不顯示，然后通過派生選擇器控制鼠標的動作，當鼠標移上去的時候，超鏈接文字顯示下劃線并顯示為深藍色。
偽類選擇器
偽類選擇器
這條規則只有當鼠標放到超鏈接上停留的時候才會被應用，因此當某種情況發生時候偽類選擇器才會被應用在某個標簽上。
a的偽類選擇器一共有四種：
:link 未被訪問的鏈接的樣式；和a標簽相同時，并且同時存在的時候會覆蓋a標簽
:hover 鼠標移動到超鏈接上的時候
:active 選擇器用于活動鏈接，被選定的超鏈接。
:visited 已被訪問的超鏈接，
注釋：在 CSS 定義中，:hover 必須位于 :link 和 :visited 之后（如果存在的話），這樣樣式才能生效。
2）使用偽類選擇器縮小選擇范圍
:first-child 縮小標簽的選擇范圍，如圖：
如果一個標簽后面還接了一個子標簽，在子標簽后面冒號：first-child，說明這里只選擇了子標簽中的第一個標簽，可以看到瀏覽器中有序列表中的第一個li子元素"北京"顏色為紫色。
偽類選擇器
偽類選擇器
CSS樣式
在head標簽中添加style子標簽，在style標簽里寫一個屬性type="text/css"，這樣瀏覽器就知道當頁面顯示出來的時候，需要把style中的CSS代碼應用到HTML中，因此可以在style標簽中創建CSS規則。
css樣式
每天進步一點點，跟著教頭學開發。
ss是一種用來為Html文檔添加樣式（字體、間距、位置、顏色、角度等顯示效果）的計算機語言。學習網站W3school。
css的引用樣式:
一:style標簽（內聯樣式）
通過在head標簽中間新建一個style標簽，該標簽內部存放的就是網頁文件中的css代碼。
二：外部引用css文件（外聯樣式）
新建一個css文件
在head標簽中間新建一個link標簽，通過href屬性設置外部的css文件地址。rel=“stylesheet”表示我們引用的一個樣式表（css文件）。
三:標簽內部style屬性（行內樣式）
在開始標簽的內部可以設置一個叫做style的屬性，屬性的雙引號存放該元素代碼的css樣式（不推薦使用）。
一般用的就是通過link標簽來引入外部css文件來修改樣式，一般修改樣式有字體，顏色，大小，文本居中，間距等。
疊樣式表 (CSS) 是一種編程語言，可用于確定電子文檔的設計。 借助簡單說明（以清晰的源代碼形式呈現），可以根據需要調整布局、顏色和版式等網站元素。 由于級聯樣式表，文檔的語義結構和內容不受影響。 CSS 出現于 20 世紀 90 年代中期，現在被認為是萬維網上的標準樣式表語言。
CSS 與 HTML 一樣，是萬維網的核心語言之一。 當您使用 HTML 將文本添加到網站并按語義構建其結構時，您可以使用 CSS 定義其內容的設計。 雖然 HTML 和 CSS 結合使用，但 CSS 設計指令和 HTML 元素是分開存在的。 這意味著即使沒有 CSS，機器也可以讀取電子文檔。 在 CSS 的幫助下，瀏覽器內容可以在視覺上準備好并以吸引人的方式呈現。
CSS 是一種“生活標準”，由萬維網聯盟繼續開發。 因此，總是有新的功能和實際應用有待發現。 廣泛應用的樣式表語言出現于 20 世紀 90 年代。 使用樣式表來顯示 Web 內容的想法在當時已不再是全新的。 但 CSS 與 HTML 中已存在的其他面向顯示的元素在一個重要方面有所不同：用戶現在可以選擇為跨多個文檔和單個樣式表的元素組定義設計規則。
定義：CSS（層疊樣式表）
用于網站視覺設計的編程語言。 例如，使用層疊樣式表，您可以確定顯示 HTML 元素的字體、大小或顏色。
一個成功的網站不僅取決于內容，還取決于良好的設計。 用戶很快就會對不用戶友好或結構良好的網站失去興趣。 在這里，CSS 提供了一系列純 HTML 中不提供的設計選項。
例如，CSS 允許您集中控制某些規范。 這意味著可以使用單個命令來識別單個文檔中的相似元素（例如所有超鏈接或圖像）并對其進行格式化。 設計指令不必采用 HTML 文檔本身內部樣式表的形式。 如果將 CSS 指令保存在外部樣式表（即單獨的文件）中，則這也可以用于其他文檔。
除了與 HTML 元素的顏色、形狀和排版相關的基本顯示指令外，CSS 中現在還有更復雜的模塊。 例如，使用這些，您可以根據輸出媒體定義動畫或不同的表示形式。 這樣，可以為所有可能的媒體以相同的方式準備相同的 HTML 文檔。 由于本文檔中的內容和設計是分開的，因此網站的代碼更加清晰。 相關的樣式語言 SASS 提供了更多的可能性，但它并沒有完全取代 CSS。
CSS 語句確定電子文檔中的元素應具有的值或屬性。 在其基本結構中，該指令由選擇器和大括號組成。 聲明列在括號內，并用分號分隔。 每個聲明由名稱、冒號和特定值組成。 在最終聲明之后和右括號之前，可以添加另一個分號，但這不是強制性的。 例如，下面示例中的 CSS 指令要求標題 h1 以藍色顯示，字體大小為 12：
h1 {color:blue; font-size:12px}可以使用內部和外部樣式表將 CSS 合并到電子文檔中。 此外，可以使用內聯樣式將屬性直接放置在元素的 HTML 源代碼中。 下面，我們概述了將 CSS 集成到 HTML 中的三種方法。
在外部樣式表中，CSS 指令通過“.css”結尾在外部文件中定義，并通過“link”標簽集成到 HTML 文件中。 這是最常見的方法，因為內容和設計完全分開，并且可以輕松進行更改。 該鏈接在 HTML 文檔的“head”區域中創建，如下所示：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="stylesheet.css">
</head>
<body>
<h1>這是一個標題</h1>
<p>這是一個段落</p>
</body>
</html>您可以在此處將所有 CSS 指令添加到 HTML 文件中。 請注意，這些僅適用于相關文件。 對于內部樣式表，將“style”元素插入 HTML 文檔的“head”區域，如下所示：
<!DOCTYPE html>
<html>
<head>
<style>
h1 {color:blue; font-size:12px;}</style></head>
<body>
<h1>這是一個標題</h1>
<p>這是一個段落</p>
</body>
</html>與內部樣式表一樣，CSS 指令包含在 HTML 文件中。 然而，有一個重要的區別：相應的屬性直接位于元素的開始標記中，并且不適用于任何其他元素。 如果您不想進行一般設計說明，則此方法特別有用。
<!DOCTYPE html>
<html>
<body>
<h1 style="color:blue; font-size:12px;">這是一個標題</h1>
<p>這是一個段落</p>
</body>
</html>上面的例子表明 CSS 只能與經典的 HTML 結構結合使用。 由于 HTML 通過段落、列表和表格構建內容，而 CSS 負責視覺設計，因此這兩種網絡語言相輔相成，并以這種方式緊密相連。 編寫級聯樣式表通常圍繞設計“盒子”進行。 HTML 文檔的結構基于嵌套原則，其中各個元素像盒子一樣相互疊放。 網站上占用空間的每個“盒子”都具有以下屬性：
然后通過指定大小、形狀和顏色來格式化這些“框”。 除了這些簡單的屬性之外，還有更復雜的 CSS 指令，用于在文本中插入陰影、添加圖像過濾功能以及突出顯示表單和其他元素。
一旦您了解了樣式表語言的基本原理，它們的應用就足夠簡單了。 了解有關 CSS 頂級技巧的更多信息，這些技巧將使您的網站看起來更加專業。
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
