รูปแบบการเขียน css
เราสามารถเขียน css ได้ 3 แบบดังนี้
- external style sheet: เขียนไว้ภายนอกเอกสาร html (เป็นรูปแบบที่นิยมใช้มากที่สุด)
- internal style sheet: เขียนไว้ภายในเอกสาร html ในส่วนของ <head>...</head>
- inline style sheet: เขียนลงใน element ของ html
external style sheet: css ที่เขียนไว้ภายนอกเอกสาร html
การเขียน css ด้วยวิธีดังกล่าว เป็นวิธีที่ดีที่สุดในกรณีที่เอกสาร html ของคุณมีหลายๆ หน้า โดยคุณสามารถเปลี่ยนคุณสมบัติหรือลักษณะของเว็บไซต์ของคุณได้ทั้งหมด โดยการเปลี่ยนคุณสมบัติหรือลักษณะของ css เพียงไฟล์เดียว ดังนั้นไฟล์ html ของคุณจะต้องเชื่อมโยง (link) กับไฟล์ css โดยใช้แท็ก <link> ดังตัวอย่างต่อไปนี้
<link rel="stylesheet" type="text/css" href="external.css" />
</head>
css แบบ external style sheet นั้นคุณสามารถเขียนขึ้นได้จาก text editor ใดๆ ก็ได้ แต่จะต้อง save นามสกุลของไฟล์เป็น ".css"
internal style sheet: css ที่เขียนในเอกสาร html ในส่วนของ <head>...</head>
การเขียน css ด้วยวิธีดังกล่าวนี้เหมาะสำหรับการกำหนดคุณสมบัติหรือลักษณะของเว็บไซต์ของคุณในหน้าใดหน้าหนึ่ง ดังที่กล่าวไว้ข้างต้นแล้ว css แบบ internal style sheet นี้คุณจะต้องกำหนดไว้ในส่วนของแท็ก <head>...</head> ดังตัวอย่างต่อไปนี้
<style type="text/css">
body{background-color:#FF0000; font-size:12px;}
h1{color:#000000;}
</style>
</head>
inline style: เขียนลงใน element ของ html
การเขียน css ด้วยวิธีดังกล่าวนี้ เป็นการเขียนเพื่อกำหนดคุณลักษณะ ของแท็ก html ในแต่ละ element ดังตัวอย่างต่อไปนี้
