CSS基礎(chǔ)學(xué)習(xí):樣式表CSS簡明教程
2006/10/12 9:19:43

作者:自由勇
樣式表CSS在網(wǎng)頁中占著極重要的地位,它的使用一直是熱門討論的話題。CSS是Cascading Style Sheet的簡寫,譯為“層疊樣式表單”。CSS幾乎可以定義所有的網(wǎng)頁元素,CSS雖然功能強(qiáng)大,但平時(shí)我們用到的是很少的,最常見的有:定義字體大小(用CSS定義的字體大小不會(huì)瀏覽器的字體設(shè)置而改變)、去掉超鏈下劃線、超鏈接變色等等。下面詳細(xì)、簡練地講如何使用CSS。
1.CSS加在什么位置?編輯CSS時(shí)候,強(qiáng)烈建議使用記事本之類的文本編輯工具打開你的網(wǎng)頁代碼。找到<head>和</head>,在<head>和</head>之間加入這句,<STYLE></STYLE>,然后所有的樣式表都定義在<STYLE>和</STYLE>之間。
有很多網(wǎng)站喜歡把樣式表寫成一個(gè)CSS文件,然后所有文件都指向這里來調(diào)用它。我個(gè)人不喜歡這樣做,因?yàn)槊宽摰腃SS都不一樣,這樣做的缺點(diǎn)還有,當(dāng)由于網(wǎng)速慢、或服務(wù)器負(fù)擔(dān)重CSS文件連接不上時(shí),網(wǎng)頁就變得很亂。直接把CSS嵌在網(wǎng)頁中,是比較明智的做法。如果你的許多網(wǎng)頁幾乎完全一樣,堅(jiān)持想使用CSS文件,可使用這句<link href=***.css rel=stylesheet>來連接CSS文件。
實(shí)例1:<STYLE>td{font-size:9pt;line-height:150%}</STYLE>這句表示網(wǎng)頁的字體大小為9磅字,行距150%,td是“單元格”元素,這句也就是對單元格內(nèi)的字體起作用。這里的<style>后面的td,表示選擇符,網(wǎng)頁內(nèi)所有的td元素都會(huì)起作用。這些選擇符可以是所有的html標(biāo)記,例如p、table、hr等等,只有少數(shù)的br除外。
實(shí)例2:<STYLE>a{color:FF0000}input{font-size:9pt}</STYLE>表示超鏈接都為紅色,單行文本框的字體是9磅。
2.CSS作用很大的一方面就是可以用來大量減少網(wǎng)頁代碼,從而為網(wǎng)頁減肥,原理就是在網(wǎng)頁中自定義樣式表的選擇符,然后在網(wǎng)頁中大量引用這些選擇符。目前大部分網(wǎng)站都是使用class來引用的。
CSS中,class和id的作用是完全一樣的,“class”單詞比“id”多3個(gè)字母。id的使用方法,在網(wǎng)頁<STYLE>和</STYLE>之間定義選擇符名,選擇符名前加#,這些選擇符名可以是字母或數(shù)字、或組合,然后在網(wǎng)頁的元素中使用id=**來引用它。
實(shí)例3:<STYLE>#8{color:000080}#p2{margin-left:20}#14{font-size:14pt}</STYLE>,然后在網(wǎng)頁使用這句引用它:<a id=8>黑藍(lán)色</a>,<a id=14>14磅的字</a>。<p id=p2>段落……
也就是說,<a id=8>黑藍(lán)色的字</a>等價(jià)于<a style=color:000080>黑藍(lán)色的字</a>;<a id=14>14磅的字</a>等價(jià)于<a style=font-size:14pt>14磅的字</a>,以此類推。這里的介紹可能有點(diǎn)不太好理解,你可以多實(shí)踐。
注意:在一定條件下,使用id來引用可能不起作用或報(bào)錯(cuò)、或與javascript的id發(fā)生沖突,這種情況下,你可以使用class來引用。class的使用方法與id一樣,所不同的是:在網(wǎng)頁的<STYLE>和</STYLE>之間定義選擇符名,名前加.(即點(diǎn))。例如<STYLE>.a1{color:FF0000}</STYLE>,然后用class=a1引用它。
3.樣式表語法。樣式表的項(xiàng)和它的值應(yīng)該用冒號(hào)連接,例如color:FF00000。樣式表也可直接嵌在段落當(dāng)中,而不用class或id引用,例如<a style=font-size:12pt>12磅字</a>。也就是使用<* style=*:*>的語法。
4.小技巧。可根據(jù)需要靈活掌握,同一個(gè)選擇符名可以多次給它定義,也可以多個(gè)選擇符名定義同一句。例如<style>#a1{color:FF0000}#a1{font-size:9pt}</style>,它等效于#a1{color:FF0000;font-size:9pt}。多個(gè)選擇符名定義同一句的方法是,各選擇符名之間加逗號(hào),例如<styl

下一頁
返回列表
返回首頁 主站蜘蛛池模板: 1024国产视频| 中文字幕人妻高清乱码| 爽爽日本在线视频免费| 国产一区二区三区不卡在线观看 | 日本人在线看片| 亚洲伊人色欲综合网| 波多野结衣系列无限发射| 午夜精品久久久久久中宇| 里番全彩本子库acg污妖王| 国产精品一区二区资源| 91色综合综合热五月激情| 女人与公拘交酡过程高清视频 | 一级特级女人18毛片免费视频| 日本精品视频在线观看| 亚洲a在线视频| 欧美巨大xxxx做受高清| 亚洲第一成年免费网站| 男人扒女人添高潮视频| 午夜国产精品久久久久| 色偷偷亚洲第一综合网| 国产在线ts人妖免费视频| 免费视频爱爱太爽了| 国产精品亚洲综合一区在线观看 | 久久婷婷五月综合97色| 欧洲吸奶大片在线看| 亚洲国产综合人成综合网站00| 波多野结衣全部作品电影 | 在线观看91精品国产入口| 在线|一区二区三区| chinesektv直男少爷| 小时代1免费观看完整版| 中文在线观看www| 日本一卡2卡3卡4卡无卡免费| 久久精品国产99国产精偷| 最近日本免费观看高清视频| 亚洲国产精品无码久久| 欧美日韩在线观看免费| 亚洲理论片中文字幕电影| 激情亚洲综合网| 人人干人人干人人干| 狠狠色综合网站久久久久久久高清|