人妻中文字幕有码在线,亚洲自偷拍视频无码

　CSS 實(shí)用實(shí)例

作者：Linyupark　時(shí)間： 2006-07-12　文檔類型：翻譯　來(lái)自：網(wǎng)絡(luò)維他命

第 1 頁(yè) CSS 實(shí)用實(shí)例 [1]
第 2 頁(yè) CSS 實(shí)用實(shí)例 [2]
第 3 頁(yè) CSS 實(shí)用實(shí)例 [3]
第 4 頁(yè) CSS 實(shí)用實(shí)例 [4]
第 5 頁(yè) CSS 實(shí)用實(shí)例 [5]
第 6 頁(yè) CSS 實(shí)用實(shí)例 [6]
第 7 頁(yè) CSS 實(shí)用實(shí)例 [7]
第 8 頁(yè) CSS 實(shí)用實(shí)例 [8]
第 9 頁(yè) CSS 實(shí)用實(shí)例 [9]

Pseudo-classes 偽類

給超級(jí)鏈接加上不同的顏色

運(yùn)行代碼框
<html> <head> <style type="text/css"> a:link {color: #FF0000} a:visited {color: #00FF00} a:hover {color: #FF00FF} a:active {color: #0000FF} </style> </head> <body> <p><b><a href="default.asp" target="_blank">This is a link</a></b></p> <p><b>Note:</b> a:hover MUST come after a:link and a:visited in the CSS definition in order to be effective!!</p> <p><b>Note:</b> a:active MUST come after a:hover in the CSS definition in order to be effective!!</p> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

給超級(jí)鏈接增加其他樣式

運(yùn)行代碼框
<html> <head> <style type="text/css"> a.one:link {color: #ff0000} a.one:visited {color: #0000ff} a.one:hover {color: #ffcc00} a.two:link {color: #ff0000} a.two:visited {color: #0000ff} a.two:hover {font-size: 150%} a.three:link {color: #ff0000} a.three:visited {color: #0000ff} a.three:hover {background: #66ff66} a.four:link {color: #ff0000} a.four:visited {color: #0000ff} a.four:hover {font-family: monospace} a.five:link {color: #ff0000; text-decoration: none} a.five:visited {color: #0000ff; text-decoration: none} a.five:hover {text-decoration: underline} </style> </head> <body> <p>Mouse over the links to see them change layout.</p> <p><b><a class="one" href="default.asp" target="_blank">This link changes color</a></b></p> <p><b><a class="two" href="default.asp" target="_blank">This link changes font-size</a></b></p> <p><b><a class="three" href="default.asp" target="_blank">This link changes background-color</a></b></p> <p><b><a class="four" href="default.asp" target="_blank">This link changes font-family</a></b></p> <p><b><a class="five" href="default.asp" target="_blank">This link changes text-decoration</a></b></p> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

使用:first-child偽類

運(yùn)行代碼框
<html> <head> <style type="text/css"> a:first-child { text-decoration:none } </style> </head> <body> <p>The :first-child pseudo-class is used to define a special style for an element that is the first child of another element.</p> <p>Visit <a >W3Schools</a> and learn CSS! Visit <a >W3Schools</a> and learn HTML!</p> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

使用:lang偽類

運(yùn)行代碼框
<html> <head> <style type="text/css"> q:lang(no) { quotes: "~" "~" } </style> </head> <body> <p>The :lang pseudo-class allows you to define special rules for different languages. In the example below, the :lang class defines the type of quotation marks for q elements with a lang attribute with a value of "no":</p> <p>Some text <q lang="no">A quote in a paragraph</q> Some text.</p> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

Pseudo-elements 偽元素

讓文字的第一個(gè)字母特殊化

運(yùn)行代碼框
<html> <head> <style type="text/css"> p:first-letter { color: #ff0000; font-size:xx-large } </style> </head> <body> <p> You can use the :first-letter pseudo-element to add a special effect to the first letter of a text! </p> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

讓文字的第一行特殊化

運(yùn)行代碼框
<html> <head> <style type="text/css"> p:first-line { color: #ff0000; font-variant: small-caps } </style> </head> <body> <p> You can use the :first-line pseudo-element to add a special effect to the first line of a text! </p> </body> </html>
[Ctrl+A 全部選擇提示：你可先修改部分代碼，再按運(yùn)行]

出處：網(wǎng)絡(luò)維他命
責(zé)任編輯：moby

上一頁(yè) CSS 實(shí)用實(shí)例 [8] 下一頁(yè)

◎進(jìn)入論壇網(wǎng)站綜合、網(wǎng)頁(yè)制作版塊參加討論

相關(guān)文章

更多相關(guān)鏈接

首屆世界CSS設(shè)計(jì)大賽結(jié)果揭曉

《CSS權(quán)威指南》

實(shí)用在線工具集

web標(biāo)準(zhǔn)布局實(shí)例教程

組合CLASS來(lái)完成網(wǎng)頁(yè)布局風(fēng)格

作者文章

設(shè)計(jì)上的精挑細(xì)選會(huì)削弱網(wǎng)站

瀏覽器發(fā)展/CSS布局/怎樣運(yùn)用?


關(guān)鍵字搜索	常規(guī)搜索	推薦文檔
熱門(mén)搜索：CSS Fireworks 設(shè)計(jì)比賽網(wǎng)頁(yè)制作 web標(biāo)準(zhǔn) 用戶體驗(yàn) UE photoshop Dreamweaver Studio8 Flash 手繪 CG

站點(diǎn)最新

站點(diǎn)最新列表

周大�！熬�•自然”設(shè)計(jì)大賽開(kāi)啟

國(guó)際體驗(yàn)設(shè)計(jì)大會(huì)7月將在京舉行

中國(guó)國(guó)防科技信息中心標(biāo)志征集

云計(jì)算如何讓安全問(wèn)題可控

云計(jì)算是多數(shù)企業(yè)唯一擁抱互聯(lián)網(wǎng)的機(jī)會(huì)

阿里行云

云手機(jī)年終巨獻(xiàn)，送禮標(biāo)配299起

阿里巴巴CTO王堅(jiān)的"云和互聯(lián)網(wǎng)觀"

1499元買(mǎi)真八核云OS雙蛋大促

首屆COCO桌面手機(jī)主題設(shè)計(jì)大賽

欄目最新

欄目最新列表

淺談JavaScript編程語(yǔ)言的編碼規(guī)范

如何在illustrator中繪制臺(tái)歷

Ps簡(jiǎn)單繪制一個(gè)可愛(ài)的鉛筆圖標(biāo)

數(shù)據(jù)同步算法研究

用ps作簡(jiǎn)單的作品展示頁(yè)面

CSS定位機(jī)制之一:普通流

25個(gè)最佳最閃亮的Eclipse開(kāi)發(fā)項(xiàng)目

Illustrator中制作針線縫制文字效果

Photoshop制作印刷凹凸字體

VS2010中創(chuàng)建自定義SQL Rule

中文字幕二区_国产精品免费在线观看_黄色网站观看_人人草人人澡_日本真实娇小xxxx