CSS基礎介紹

css介紹

css是指層疊樣式表，css樣式表極大的提高了工作效率

css基礎語法

1. 首先選擇乙個屬性

2. 選擇了屬性以後，用大括號括起來

3. 括號裡面是對應的屬性和屬性值，如：

selector

h1是屬性，然後乙個大括號，括號中的color是屬性，後面跟著對應的屬性值red，設定結束後需要用;來分別各個屬性

h1

需要在html中來使用css樣式，可以用標籤來呼叫css檔案，如：

doctype html

>
<
html
>
<
head
>
<
title
>
title
>
<
meta 
charset
="utf-8"
>
<
link 
rel="stylesheet"
type
="text/css"
href
="test.css"
>
head
>
<
body
>
<
h1>我被css改變了。
css選擇器分組：
選擇器分組就是將一堆頁面元素，一起定義：
h1, h2, h3, p, a
css派生類選擇

根據元素在其位置的上下文關係來定義樣式，就比如標籤中的標籤，如果直接定義body元素，就會把其中所有的值都改變，但是單單針對某些元素來定義，也是可以的。當然針對乙個元素定義的樣式的優先順序，要比定義全部樣式的優先順序高。所以即使是修改了樣式，也可以針對單個元素進行修改。
如下**：
doctype html

>
<
html
>
<
head
>
<
title
>
title
>
<
meta 
charset
="utf-8"
>
<
link 
rel="stylesheet"
type
="text/css"
href
="test.css"
>
head
>
<
body
>
<
p>我是小p，我是body p{}指定的標籤改變的
p>
<
h1>我是標題
h1>
body
>
html
>
然後我們用css樣式來修改

可以看到，將body全部定義成綠色了，但是如果指定body中的p元素進行定義，還是可以將其改變顏色的。所以指定的元素的優先順序要比全部定義的高。相反沒有指定定義的h1標題，就是綠色。
id選擇器
id選擇器可以為標有id的html元素指定特定的樣式，id選擇器以「#」來定義。id選擇常常用於簡歷派生選擇器，他們經常一起來使用
doctype html

>
<
html
>
<
head
>
<
title
>
title
>
<
meta 
charset
="utf-8"
>
<
link 
rel="stylesheet"
type
="text/css"
href
="test.css"
>
head
>
<
body
>
<
div 
id="testid"
>
呵呵呵呵
<
p>哈哈哈，我被指定定義了顏色，id與元素經常一起使用！
p>
div>
body
>
html
>

/*

id可以直接用#號來表示
css類選擇器
類選擇器是以乙個點「.」來顯示的，class也可以結合派生選擇器來一起使用，比如定義了乙個元素
利用css可以如下修改：
/*class

可以需要用「.」來表示
*/.testclass.testclass p
屬性選擇器：

屬性選擇器就是針對標籤中的屬性來進行修改，當然，也可以根據屬性的值，來針對性的修改：
doctype html

>
<
html
>
<
head
>
<
title
>
title
>
<
meta 
charset
="utf-8"
>
<
link 
rel="stylesheet"
type
="text/css"
href
="test.css"
>
head
>
<
body
>
<
ol type
="i"
>
<
li>屬性選擇器
li>
<
li>屬性選擇器
li>
<
li>屬性選擇器
li>
ol>
<
ol type
="1"
>
<
li>屬性選擇器
li>
<
li>屬性選擇器
li>
<
li>屬性選擇器
li>
ol>
<
ol type
="a"
>
<
li>屬性選擇器
li>
<
li>屬性選擇器
li>
<
li>屬性選擇器
li>
ol>
body
>
html
>
然後用css來修改

/*

如果沒有值，通過屬性修改全部的樣式
*/[type]
/*有值的話，就是針對值進行修改
總結：主要學習了css的用法，已經派生選擇器的使用，id選擇器的使用，class選擇器的使用和屬性選擇器的使用
id---以「#」開頭
class---以「.」開頭
屬性選擇器---以在括號類填寫屬性和值
派生選擇器---直接呼叫標籤，如：
 
CSS介紹 筆記 css基礎知識
css介紹 筆記 網頁背景描述 外部樣式表檔案 另外建乙個新的.css檔案 h1 color pink background color aqua font size 20px css使用方式 css h1 匹配頁面中所有的h1標籤 統一新增樣式 h1 color green background ...
css3基礎介紹
一 css3選擇器 1，css2.1選擇器 標籤 div 類 class id id 萬用字元 交集 div.d id 並集 div,p,span,id 後代 div p span 2，關係選擇器 兒子 ie7開始相容 下乙個兄弟 ie7開始相容 後邊所有兄弟 jquery都可以使用，ie6也能使用...
CSS基礎之簡單介紹
元素 元素是文件結構的基礎，在css中，每個元素都會生成乙個框 或者說盒 表現形式 替換元素 替換元素的內容並非有瀏覽器直接生成，典型的莫 過於img元素了 非替換元素 大部分html元素都是非替換元素，如div元素 p元素等 塊級元素 填充父元素的內容區 行內元素 在文字行內生成元素框 宣告css...