01 css的引入方式

在html中引入css方式總共有三種：

行內樣式

內接樣式

外接樣式

3.1 鏈結式

3.1 匯入式

css介紹

現在的網際網路前端分三層：

css：cascading style sheet，層疊樣式表。css的作用就是給html頁面標籤新增各種樣式，定義網頁的顯示效果。簡單一句話：css將網頁內容和顯示樣式進行分離，提高了顯示功能。

css的最新版本是css3，我們目前學習的是css2.1

接下來我們要講一下為什麼要使用css。

html的缺陷

不能夠適應多種裝置

要求瀏覽器必須智慧型化足夠龐大

資料和顯示沒有分開

功能不夠強大

css優點：

使資料和顯示分開

降低網路流量

使整個**視覺效果一致

使開發效率提高了（耦合性降低，乙個人負責寫html，乙個人負責寫css）

比如說，有乙個樣式需要在一百個頁面上顯示，如果是html來實現，那要寫一百遍，現在有了css，只要寫一遍。現在，html只提供資料和一些控制項，完全交給css提供各種各樣的樣式。

行內樣式

doctype html

>
<
html 
lang
="en"
>
<
head
>
<
meta 
charset
="utf-8"
>
<
title
>title
title
>
head
>
<
body
>
<
div><
p style
="color:green"
>我是乙個段落
p>
div>
body
>
html
>

doctype html

>
<
html 
lang
="en"
>
<
head
>
<
meta 
charset
="utf-8"
>
<
title
>title
title
>
<
style 
type
="text/css"
>
pstyle
>
head
>
<
body
>
<
div>
<
p style
="color:green"
>我是乙個段落
p>
div>
<
p>段落
p>
body
>
html
>

外接樣式-鏈結式

<

link 
rel="stylesheet"
href
="./index.css"
>

doctype html

>
<
html 
lang
="en"
>
<
head
>
<
meta 
charset
="utf-8"
>
<
title
>title
title
>
<
link 
rel="stylesheet"
href
="./index.css"
>
head
>
<
body
>
<
div>
div>
<
a href
="#"
a>
body
>
html
>

a

外接樣式-匯入式

<

style 
type
="text/css"
>
@import url('./index.css');
style
>

doctype html

>
<
html 
lang
="en"
>
<
head
>
<
meta 
charset
="utf-8"
>
<
title
>title
title
>
<
style 
type
="text/css"
>
@import url('./index.css');
style
>
head
>
<
body
>
<
div>
div>
<
a href
="#"
a>
body
>
html
>

01 css引入方式

現在的網際網路前端分三層 css cascading style sheet，層疊樣式表。css的作用就是給html頁面標籤新增各種樣式，定義網頁的顯示效果。簡單一句話 css將網頁內容和顯示樣式進行分離，提高了顯示功能。css的最新版本是css3，我們目前學習的是css2.1 接下來我們要講一下為...

CSS基礎01 CSS簡介

html只關注內容的語義，雖然也可以做一些簡單的顏色 規格設定，但是十分繁瑣。css是層疊樣式表 cascading style sheets 的簡稱，有時也被稱為css樣式表或級聯樣式表。css也是一種標記語言，css主要用於設定html中的文字格式 字型 大小 對齊方式等 的外形 寬高 邊框樣式...

01 css編碼技巧 css揭秘

一 儘量減少 重複 1.按鈕 btn 2.易維護vs.量少 3.currentcolor 自動從文字那獲取顏色值 hr 3.繼承 inherit inherit 可以用在任何css 屬性中，而且它總是繫結到父元素的計 算值 對偽元素來說，則會取生成該偽元素的宿主元素 這個inherit 關鍵字對於背...