Grunticon เป็นงานที่ Grunt.js ที่สามารถทำงานในโฟลเดอร์ที่มีภาพ SVG คุณสามารถใช้ภาพ PNG เช่นกัน แต่ผลที่ได้จะไม่มาก "vectorish."
Grunticon ทำงานโดยการทั้งหมดเหล่านี้ไอคอน SVG และสร้างโค้ด CSS ที่คุณสามารถใช้การฝังอย่างถูกต้องพวกเขาบนหน้าเว็บที่มีการสนับสนุนในตัวสำหรับรูปแบบการตอบสนองและอุปกรณ์ Retina
รหัส CSS สร้างขึ้นโดยการตรวจสอบนี้ครอบคลุมพื้นฐานทั้งหมดมาในสามรุ่นที่แตกต่างกัน
- SVG URL ที่ข้อมูล
- PNG URL ที่ข้อมูล
- ภาพ PNG คลาสสิก
วิธีที่สามถูกรวมเป็นทางเลือกสำหรับเบราว์เซอร์ที่ไม่สนับสนุนข้อมูล SVG, การแสดงผลไอคอน SVG เป็นภาพ PNG ปกติ ถ้า SVGs ไม่ได้อยู่ในรูปแบบ PNG แล้ว Grunticon จะแปลงพวกเขาสำหรับคุณโดยอัตโนมัติและวางไว้ในโฟลเดอร์พิเศษ
โดยการแก้ไขไม่กี่บรรทัดในแฟ้มงาน Grunt.js นักพัฒนายังสามารถปรับลักษณะของไอคอนที่ออกมาตั้งแต่ CSS คำนำหน้าไปยังตำแหน่งของไฟล์ HTML แสดงตัวอย่างที่
พร้อมกับ CSS ไฟล์ JS ขนาดเล็กยังสามารถสร้างซึ่งสามารถนำมาใช้ในการโหลดไฟล์ SVG ถ่ายทอดสดให้แน่ใจว่าพวกเขาไม่ได้ปิดกั้นการแสดงผลหน้าถ้าหลายรายการที่ถูกนำมาใช้ในหน้าเดียวกัน
ไอคอนที่สร้างผ่าน Grunticon ยังมีความสามารถที่จะผ่านสไตล์ CSS, แสดงผลในรูปแบบสีที่แตกต่างกันและมีชีวิตชีวาแม้กระทั่ง
. คำแนะนำการติดตั้งมีให้กับไฟล์ README แพคเกจของ
ต้องการ
- Grunt.js 0.4.2 หรือสูงกว่า
ความคิดเห็นที่ไม่พบ