บทที่ 9 แนะนำการเขียน CSS เบื้องต้น ตอน ชื่อแท็ก
- <b> รูปแบบเริ่มต้นคือแสดงตัวอักษรเป็นตัวหนา หรือ เทียบกับ CSS ได้เป็น font-weight: bold;
- <i> รูปแบบเริ่มต้นคือแสดงตัวอักษรเป็นตัวเอียง หรือ เทียบกับ CSS ได้เป็น font-style: italic;
b {
font-style:italic; // ทำตัวอักษรให้เป็นตัวเอียง
font-weight: normal; // ยกเลิกตัวอักษรหนาเป็นตัวอักษรปกติ
}
i {
font-weight: bold; // ทำตัวอักษรให้เป็นตัวอักษรหนา
font-style: normal; // ยกเลิกตัวอักษรเอียงเป็นตัวอักษรปกติ
}คำสั่งด้านบนจะทำให้ <b>แสดงผลเป็นตัวเอียง และ <i> แสดงผลเป็นตัวหนาแทน ซึ่งจะมีผลกับ <b> และ <i> ทุกตัวในหน้าเว็บเพจ
โค้ดด้านบนเป็นการใช้ชื่อแท็กเพื่อกำหนด CSS ซึ่งเป็นอีกวิธีหนึ่งในการกำหนดค่านอกจากการใช้คลาสและไอดี ตามที่ผมได้เคยกล่าวถึงในบทก่อนๆไปแล้วและเช่นกัน เราสามารถใช้ชื่อแท็ก ร่วมกับ ไอดี และ คลาส ในการกำหนดค่า CSS ได้
<style>
b {
font-style: italic;
font-weight: normal;
}
i {
font-weight: bold;
font-style: normal;
}
.red {
color: #F00;
}
</style>
<b>ข้อความภายใต้แท็ก b</b>
<i>ข้อความภายใต้แท็ก i</i>
<b class=red>ข้อความภายใต้แท็ก b คลาส red</b>
<i class=red>ข้อความภายใต้แท็ก i คลาส red</i>
ผลลัพท์ :
ข้อความภายใต้แท็ก b
ข้อความภายใต้แท็ก i
ข้อความภายใต้แท็ก b คลาส red
ข้อความภายใต้แท็ก i คลาส red