網路城邦
上一篇 回創作列表 下一篇   字體:
CSS語法的定義及元素樣式?
2007/05/02 21:14:21瀏覽619|回應0|推薦1

CSS語法的定義及元素樣式?

■CSS語法的定義:

CSS 的語法定義基本上如以下的形式:

<style>
slector {property:value; property:value; ....}
</style>


第一種 selector 方式是以指定 HTML 元素樣式的方式定義,比如 FONT、BODY、 TD...等等
第二種 selector 方式是以 CLASS 元素樣式的方式定義
第三種
selector 方式則是以 ID 樣式的方式定義
第四種
selector 方式則是以 inline 樣式的方式定義
第五種
selector 方式則是以 Contextual 樣式的方式定義

property 則是指要修改的性質,如 boder、font-color、font-size...等性質
value 則是給予 property 的值,如:P {color: #FF0000; }P {color: red; }
通常編輯時會把所有的定義,如以下的方式全放置於在 STYLE裏面,再放到 HEAD 內:


<head>
<style>
<!--
#slidemenubar, #slidemenubar2{
position:absolute;
left:-155px;
width:160px;
top:0px;
border:1.5px solid green;
background-color:skyblue;
layer-background-color:skyblue;
font:bold 12px Verdana;
line-height:20px;
}
-->

</style>
</head>

或先編輯一個CSS的外在樣式檔,再於網頁中以下列方式包含入網頁中:


<head>
<link rel=stylesheet type="text/css" href="樣式檔名稱.css">
</head>

■CSS語法的元素樣式:

HTML元素樣式
說明:
在<style></style>中做設定,當slector為HTML元素名稱時,瀏覽器會以HTML元素本身的特性為依據,再加上此部分之HTML元素樣式設定,以增加HTML元素本有的特性,來呼喚使用。
設定格式:
HTML元素名稱 {property:value; property:value; ....}
使用格式:
<HTML元素名稱></HTML元素名稱>
CLASS元素樣式
說明:
在<style></style>中做設定,針對群族做樣式處理,以達到使用同一個HTML元素名稱時,有多個不同樣式設定的選擇。
設定格式:
HTML元素名稱.CLASS樣式名稱 {property:value; property:value; ..}
使用格式:
<HTML元素名稱 class="CLASS樣式名稱"></HTML元素名稱>
ID樣式
說明:
在<style></style>中做設定,針對單一元素做樣式設定,以配會不同HTML元素名稱,皆可使用此樣式設定。
設定格式:
#ID樣式名稱 {property:value; property:value; ..}
使用格式:
<HTML元素名稱  id=ID樣式名稱></HTML元素名稱>
inline樣式
說明:
直接在HTML元素在中做設定,針對單一元素做樣式設定,以配會不同HTML元素名稱,皆可使用此樣式設定。
設定格式:
style=" property:value; property:value; .."
使用格式:
<HTML元素名稱  style="property:value property:value; .."></HTML元素名稱>
Contextual樣式
說明:
在<style></style>中做設定,針對元素階層做樣式設定。
設定格式:
父HTML元素名稱 子HTML元素名稱 { property:value; property:value; ..}
使用格式:
<父HTML元素名稱><子HTML元素名稱></子HTML元素名稱></父HTML元素名稱> 
( 創作詩詞 )
回應 推薦文章 列印 加入我的文摘
上一篇 回創作列表 下一篇

引用
引用網址:https://classic-blog.udn.com/article/trackback.jsp?uid=bensonhong&aid=934304