ในอดีต เรามักจะใช้สไตล์ชีทในสองวิธี:
วิธีการแบบอินไลน์ของหน้า: สไตล์ชีตจะถูกเขียนโดยตรงในพื้นที่ส่วนหัวของโค้ดของหน้า บางสิ่งเช่นนี้:
<style type="text/css"> <!-- body { พื้นหลัง : สีขาว ; สี : สีดำ ; } --> </style>
วิธีการเรียกภายนอก: เขียนสไตล์ชีทในไฟล์ .css แยกต่างหาก จากนั้นเรียกมันด้วยโค้ดที่คล้ายกับต่อไปนี้ในส่วนหัวของหน้า
<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="ทั้งหมด" />
ในการออกแบบที่สอดคล้องกับมาตรฐานเว็บ เราใช้วิธีการเรียกภายนอก ประโยชน์ที่เห็นได้ชัดเจนในตัวเอง คุณสามารถเปลี่ยนรูปแบบของหน้าโดยไม่ต้องแก้ไขหน้า และแก้ไขเฉพาะไฟล์ .css หากทุกหน้าเรียกไฟล์สไตล์ชีตเดียวกัน การเปลี่ยนไฟล์สไตล์ชีตหนึ่งไฟล์สามารถเปลี่ยนสไตล์ของไฟล์ทั้งหมดได้
วิธีการเรียกสไตล์ชีตแบบตารางคู่
เมื่อดูโค้ดต้นฉบับของไซต์ที่เป็นไปตามมาตรฐานบางแห่ง คุณอาจเห็นประโยคสองประโยคต่อไปนี้ซึ่งมีการเรียกสไตล์ชีต:
<link rel="stylesheet" rev="stylesheet" href="css/style.css" type="text/css" media="all" /> <style type="text/css" media="all"> @นำเข้า URL( css/style01.css );</style>
ทำไมต้องเขียนสองครั้ง?
ในความเป็นจริง ภายใต้สถานการณ์ปกติ การใช้วิธีลิงก์ภายนอกก็เพียงพอแล้ว (นั่นคือ ประโยคแรก) การเรียก double-table ที่ฉันใช้ที่นี่เป็นเพียงตัวอย่างเท่านั้น คำสั่ง "@import" ใช้เพื่อเข้าสู่สไตล์ชีต คำสั่ง "@import" ไม่ถูกต้องในเบราว์เซอร์ Netscape 4.0 กล่าวอีกนัยหนึ่ง เมื่อคุณต้องการให้เอฟเฟกต์บางอย่างซ่อนอยู่ในเบราว์เซอร์ Netscape 4.0 และแสดงใน 4.0 ขึ้นไปหรือเบราว์เซอร์อื่น คุณสามารถใช้วิธีคำสั่ง "@import" เพื่อเรียกสไตล์ชีตได้