# css樣式選擇棄Test2 <HTML> <HEAD> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <TITLE>類別選擇器的種類 </TITLE> <STYLE> /* 定義特定標籤的選擇器 */ { background-color : lightBlue } /* 定義th標籤的style */ /* 一種元素可以定義多種類別選擇器,各個類別以各自的樣式來呈現 */ td.bookname { color : blue } /* 定義td標籤的bookName類別 */ td.authorName { font-style : italic ; color : blue } /* 共用類別選擇器,可以套用在不同的元素標籤 */ .title{ color : deepPink } /* 定義title共用類別 */ /* 某特定的id元素選擇器 */ #onSale{ color : green ; background-color : lightGreen } /* 定義id為onSale的樣式 */ </STYLE> </HEAD> <BODY> <HR> <H1 class="title">選擇器簡介</H1> <!-- h1標籤套用共用類別title --> <H2 class="title">1.定義特定標籤的選擇器</H2> <!-- h2標籤套用共用類別title --> <P> <H2 class="title">2.可針對特定的標籤,定義多種類別的樣式</H2> <!-- TD標籤套用不同的類別 --> <TABLE border="1"> <TR><TH>書名 <TH>作者 <TH>價格 <TH>出版商 <TR><TD class="bookName">往陽光多處走 <TD class="authorName">吳淡如 <TD> NT$ 320 <TD>天下文化 <TR><TD class="bookName">與幸福有約 <TD class="authorName">吳淡如 <TD> NT$ 300 <TD>天下文化 <TR><TD class="bookName">柯林頓自傳 <TD class="authorName">柯林頓 <TD> NT$ 260 <TD>天下文化 </TABLE> <H2 class="title">3.可定義共用的樣式,供各標籤套用</H2> <H2 class="title">4.可定義特定的ID樣式,供各標籤套用</H2> <P id="onSale">本日促銷書: 哈利波特</p> <!-- 套用id:onSale --> </BODY> </HTML>