การ Include ใน CSS โดย @import

By | 01/01/2013
CSS

CSS

สวัสดีครับ

วันนี้ปรับแต่ง font ในส่วนของ title ใหม่ โดยเอา font อยู่ในเครื่องมาทำ แต่ยังออกมาไม่ถูกใจอยู่ดี เพราะสระไม่แสดงครับ หลายคนคงไม่เคยเอา font ในเครื่องมาทำเว็บ เพราะคิดว่ามันทำไม่ได้ หรือไม่รู้วิธีทำ
สำหรับที่ได้แก้ไข title ไปผมได้ใช้เครื่องมือ แบบ online ช่วยในการ Converter font ธรรมดาในเครื่องเราออกมาพร้อม gen code css มาให้ด้วย สามารถนำไปใช้งานได้ทันที ส่วนใครอยากรู้ว่าเจ้าเครื่องมือที่ว่านั้นอยู่ไหน อยู่นี่ครับ คือ font2web.com นั่นเองก็เข้าไปลองใช้ดูกันครับ

แต่พอดีว่า หลังจากเราได้ converter font ของเราเสร็จแล้ว เราจะใช้วิธีไหนในการเอา font มาใช้ร่วมกับ css เว็บเดิมของเรา วิธีที่นึกออกและง่ายที่สุดคือ ใช้ @import นี่แหละ
การใช้งาน @import ก็ไม่มีอะไรมากครับเหมือนๆ php
มาดูตัววอย่างการใช้งาน @import นะครับ สิ่งสำคัญก็อยู่การระบบ dir ต้องดูดีๆ นะครับ ถ้าใส่ผิดมันจะไม่ทำงานเหมือนไม่ได้ import เลย

ตัวอย่างที่ 1


ตัวอย่างที่ 2

@import url('/css/header.css') screen;
@import url('/css/content.css') screen;
@import url('/css/sidebar.css') screen;
@import url('/css/print.css') print;

จากตัวอย่างที่ 1 เราจะสามารถใช้ @import ได้เลยหากอยู่ภายใต้ TAGปกติจะเป็นไฟล์ html ที่ต้องมา TAG
และตัวอย่างที่ 2 คือกรณีไฟล์ css เราสามารถใช้ @import ได้เลยหากไฟล์นั้นเป็นไฟล์ css อยู่แล้ว

ก็ลองนำวิธีนี้ไปใช้กันดูครับ สามารถจัดการได้ง่ายขึ้นเยอะเลย

ใส่ความเห็น