ดาวน์โหลด Micon - ดาวน์โหลดซอร์สโค้ด Micon

Micon

ดาวน์โหลดแบบอักษร

v3.0.168

ดาวน์โหลด

ไมครอน

MICON (ไอคอน MDL2), ชุดเครื่องมือ Windows 10 Windows และ CSS ที่เป็นสัญลักษณ์
ไอคอนนี้ถูกตัดออกเป็น segmdl2.ttf ใน windows 10 และแปลงชุดเครื่องมือ CSS เกินไปตาม แบบอักษรที่ยอดเยี่ยม ไอคอนไมซอนที่สามารถปรับแต่งได้ทันที - ขนาดสี, เงาหล่นและอะไรก็ตามที่สามารถทำได้ด้วยพลังของ CSS

การสาธิตออนไลน์และเอกสาร: http://xtoolkit.github.io/micon/ (เพราะฉันยุ่งมากเอกสารออนไลน์ที่ไม่ได้อัปเดตสำหรับ Bower และอาคาร)

sry สำหรับภาษาอังกฤษที่ไม่ดีของฉัน

การติดตั้ง

ตัวเลือกด่วน: ใช้ cdn

คุณสามารถใช้ CDN โฮสต์โดยหน้า GitHub และมีเมฆมากโดยตัวอย่าง CloudFlare:

 < head >
...
< link rel =" stylesheet " href =" http://cdn.arshen.ir/micon/3.0.168/dist/micon/css/micon.min.css " >
...
</ head >

ตัวเลือกที่หนึ่ง: ติดตั้งด้วย bower

ในการติดตั้งผ่าน Bower เพียงทำสิ่งต่อไปนี้:

 $ bower install micon --save

ตัวเลือกที่สอง: ดาวน์โหลด repo หรือตัวอักษรที่สร้างขึ้น

ดาวน์โหลดรุ่นสุดท้ายของ Micon จาก GitHub

เริ่มต้นใช้งาน

1- คัดลอกไดเรกทอรี micon-repo/dist/micon/ ทั้งหมดลงในโครงการของคุณ หากคุณไม่ได้ใช้ ไอคอน WebBrand ในแบบอักษรให้ใช้ micon-repo/dist/micon_nb/

2- ใน <head> ของ html ของคุณอ้างอิงตำแหน่งไปยัง micon.min.css ของคุณ
ตัวอย่าง:

 < head >
...
< link rel =" stylesheet " href =" micon-repo/dist/micon/css/micon.min.css " >
...
</ head >

ใช้ไอคอนใน HTML

ตัวอย่าง:

< i class = " mi mi-Home " ></ i >
OR
< i class = " mi " > &#xEC15; </ i >

สร้างคำแนะนำ (สำหรับทำแบบอักษรที่กำหนดเอง)

repo นี้มาพร้อมกับไฟล์ทั้งหมดที่สร้างขึ้นและพร้อมที่จะไป แต่ยังสามารถสร้างแบบอักษรจากแหล่งที่มา ต้องใช้ nodejs

ทำตามขั้นตอนเหล่านี้เพื่อสร้างแบบอักษรที่กำหนดเอง:

1- การติดตั้งต้องใช้การพึ่งพา ( อึก, อึก-consolidate, gulp-iconfont, gulp-rename, หนวด ) ด้วยคำสั่ง Down

 $ npm install

2- ปรับแต่งไอคอนของคุณจาก /icons/
หากเพิ่มไอคอนใหม่ให้ใส่ชื่อไอคอนใน db.json
ตัวอย่าง:

{
    ...,
    "svgfilename" : {
        "info" : {
            "created" : " 1.0.155 " //font-version
        },
        "alias" : [
            " aliasname1 " ,
            " aliasname2 "
        ]
    }
}

3- กำหนดค่า config.json สำหรับแบบอักษรของคุณ

4- ปรับแต่ง SCSS ของคุณน้อยกว่าและ CSS เทมเพลตใน .templates/ (เทมเพลตการใช้แบบอักษรเริ่มต้นที่แก้ไขโดย MICON)

5- สร้างแบบอักษรของคุณด้วยคำสั่ง Down

 $ npm start

6- จบคุณสามารถดูตัวอย่างแบบอักษรของคุณใน /dist/your_fontname/html-demo-your_fontname.html

คำแนะนำในการสร้างหน้า (สำหรับกำหนดเองหน้าตัวอักษรของคุณ)

คุณสามารถสร้างหน้าฟอนต์ของคุณเอง (เช่นหน้า micon gitHub) ด้วยคำแนะนำนี้

การกำหนดเวอร์ชัน

Micon จะได้รับการดูแลรักษาภายใต้แนวทางการกำหนดเวอร์ชันความหมายให้มากที่สุด การเผยแพร่จะถูกกำหนดหมายเลขด้วยรูปแบบต่อไปนี้:

<major>.<minor>.<fpatch>

และสร้างด้วยแนวทางต่อไปนี้:

Major -> การทำลายความเข้ากันได้ย้อนหลัง
ผู้เยาว์ -> แก้ไขข้อบกพร่องเพิ่มเติมใหม่
fpatch -> เวอร์ชันของ segmdl2.ttf

สำหรับข้อมูลเพิ่มเติมเกี่ยวกับ Semver กรุณาเยี่ยมชม http://semver.org

เวอร์ชันถัดไป

เรากำลังคิดที่จะสนับสนุน React และ Vuejs

เปลี่ยนบันทึก

เวอร์ชัน 3.0.168 (14/01/2019)

อัปเดตไอคอน MDL2 เวอร์ชัน => 168 (ตุลาคม 2018)
- 350 ไอคอนใหม่ (35 ไอคอนไม่มีชื่อ)
- ไอคอน SVG มีขนาดใหญ่ขึ้น
อัปเดตไอคอน WebBrand (268 ไอคอนใหม่)
ลบคลาสสิกสร้างตัวอักษร CSS
ใช้ คอมไพเลอร์ SCSS สำหรับสร้างตัวอักษร CSS
ลบ sourceMap โดยค่าเริ่มต้น
เปลี่ยน Lodash ด้วย หนวด
อัปเดต SCSS และเทมเพลต น้อยลง เป็น ตัวอักษรที่ยอดเยี่ยม 5.6.3
เปลี่ยนชื่อ FontName. (SCSS | น้อยกว่า) ไฟล์เป็นสไตล์ (SCSS | น้อยกว่า)
ย้ายตัวอักษรกำหนดค่าจาก gulpfile.js ไปเป็นไฟล์ config.json ในรูท
ไอคอนชื่อไฟล์ db ย้ายไปยังไดเรกทอรีไอคอนแพ็ค (db.json)
เขียนใหม่ gulpfile.js

เวอร์ชัน 2.2.155 (05/01/2017)

แก้ไขปัญหา #13
แก้ไขปัญหาการคอมไพล์น้อยลง
เพิ่ม sourcemap สำหรับ micon และ micon_nb

เวอร์ชัน 2.1.155 (29/12/2016)

สนับสนุน Bower
เพิ่ม SCSS และเทมเพลต น้อยลง
ย้ายเทมเพลตไปยัง. templates
แก้ไข style.css ปัญหา

เวอร์ชัน 2.0.155 (23/12/2016)

เพิ่ม gulpjs สำหรับ build micon หรือ Easy สร้างไอคอน Micon แบบอักษรแบบอักษรแบบกำหนดเอง
เพิ่มไอคอน WebBrand
เพิ่มแบบอักษรมาตรฐาน WOFF2 และ OTF
เพิ่ม html-demo-micon.html สำหรับไอคอนดูแบบพกพาแบบง่าย
อัปเดตเทมเพลตสไตล์
แก้ไขปัญหาชื่อนามแฝง
แก้ไข probrom มุมมองแบบอักษร (ความสูง ฯลฯ ของไอคอน)