30個(gè)你不可不知的css選擇器,類選擇器語(yǔ)法?
1. 標(biāo)簽名選擇器 div { color:Red;} 即頁(yè)面中的各個(gè)標(biāo)簽名的css樣式 2.類選擇器 .divClass {color:Red;} 即定義的每個(gè)標(biāo)簽的class 中的css樣式 3.ID選擇器 #myDiv {color:Red;} 即頁(yè)面中的標(biāo)簽的id 4.后代選擇器(類選擇器的后代選擇器) .divClass span { color:Red;} 即多個(gè)選擇器以逗號(hào)的格式分隔 命名找到準(zhǔn)確的標(biāo)簽 5.群組選擇器 div,span,img {color:Red} 即具有相同樣式的標(biāo)簽分組顯示
css超鏈接link怎么用?
1. 打開(kāi)文檔,然后打開(kāi)“CSS樣式”面板。
2. 在“CSS樣式”面板中,點(diǎn)擊右下角的“新建 CSS 規(guī)則”按鈕,打開(kāi)“新建 CSS 規(guī)則”對(duì)話框。
在“選擇器類型”中選擇“復(fù)合內(nèi)容(基于選擇的內(nèi)容)”項(xiàng)。
在“選擇器名稱”中點(diǎn)擊右邊的下拉箭頭,我們可以看到:
a:link:未訪問(wèn)的超鏈接。
a:visited:已經(jīng)訪問(wèn)過(guò)的超鏈接。
a:hover:鼠標(biāo)指針移動(dòng)到上面時(shí)的超鏈接。
a:active:正在訪問(wèn)的超鏈接。
3. 在“選擇器名稱”中選擇“a:link”項(xiàng),然后點(diǎn)擊“確定”按鈕,打開(kāi)“CSS 規(guī)則定義”對(duì)話框。
4. 在“CSS 規(guī)則定義”對(duì)話框中,在“分類”下拉框中選擇“類型”,然后在右邊“類型”部分設(shè)置鏈接字體的顏色、大小和修飾等。
5. 設(shè)置好以后單擊“確定”按鈕,完成“a:link”項(xiàng)的設(shè)置。
DW中常用css樣式四種類型詳細(xì)解析說(shuō)明?
1、外部樣式
格式:<link type="text/css" rel="stylesheet" href="css路徑" />
舉例:<link type="text/css" rel="stylesheet" href="layout.css"/>
用處:這種形式是把css單獨(dú)寫到一個(gè)css文件內(nèi),然后在源代碼中以link方式鏈接。它的好處是不但本頁(yè)可以調(diào)用,其它頁(yè)面也可以調(diào)用,是最常用的一種形式。
備注:Rel:指明連接的是什么文件; Type:指明引入的文件的格式類型; Href:指明文件的路徑,以引入文件為基準(zhǔn)的相對(duì)路徑。
2、內(nèi)部樣式
格式: <style type="text/css">選擇器 {聲明1、聲明2………}</style>
這樣的話,該文件中的所有P標(biāo)簽都將應(yīng)用該style樣式,而不需要在沒(méi)一個(gè)html標(biāo)簽中寫。
用處:這種形式是內(nèi)部樣式表,它是以<style>和</style>結(jié)尾,寫在源代碼的head標(biāo)簽內(nèi)。這樣的樣式表只能針對(duì)本頁(yè)有效。不能作用于其它頁(yè)面
3、舉例:
<html>
<head>
<title></title>
<style>
P{
font-size:50px;
color:red;
text-deceration:line
}
</style>
</head>
<body>
</body>
</html>
4、行內(nèi)樣式:就是直接在html標(biāo)簽后面寫樣式代碼
<p style=”font-size:50px;color:red;text-deceration:line”>啊啊啊啊</p>
用處:這種在標(biāo)簽內(nèi)以style標(biāo)記的為內(nèi)部樣式,內(nèi)部樣式只針對(duì)標(biāo)簽內(nèi)的元素有效,因其沒(méi)有和內(nèi)容相分離,所以不建議使用。
5、導(dǎo)入樣式
@import url("/css/global.css");
鏈接樣式是以@import url標(biāo)記所鏈接的外部樣式表,它一般常用在另一個(gè)樣式表內(nèi)部。如layout.css為主頁(yè)所用樣式,那么我們可以把全局都需要用的公共樣式放到一個(gè) global.css的文件中,然后在layout.css中以@import url("/css/global.css")的形式鏈接全局樣式,這樣就使代碼達(dá)到很好的重用性。
6、CSS 規(guī)則由兩個(gè)主要的部分構(gòu)成:選擇器,以及一條或多條聲明。
selector {declaration1; declaration2; ... declarationN }
選擇器通常是您需要改變樣式的 HTML 元素。
每條聲明由一個(gè)屬性和一個(gè)值組成。
屬性(property)是您希望設(shè)置的樣式屬性(style attribute)。每個(gè)屬性有一個(gè)值。屬性和值被冒號(hào)分開(kāi)。
selector {property: value}
下面這行代碼的作用是將 h1 元素內(nèi)的文字顏色定義為紅色,同時(shí)將字體大小設(shè)置為 14 像素。
在這個(gè)例子中,h1 是選擇器,color 和 font-size 是屬性,red 和 14px 是值。
h1 {color:red; font-size:14px;}
提示:請(qǐng)使用花括號(hào)來(lái)包圍聲明。
css層次選擇器怎么用?
css層次選擇器具體用法如下:
采用后代選擇器 :從上面可以看出所有的標(biāo)簽都是body的后代,那么我們使用后代選擇器,就可以將body的后代(所有標(biāo)簽)改變樣式: 后代選擇器是用祖先加上空格再加上后代標(biāo)簽類型進(jìn)行聲明的。
以上資料供參考。