หน้าแรก>การเขียนโปรแกรมที่เกี่ยวข้อง>ส่วนประกอบของบุคคลที่สาม
ดาวน์โหลด

หน่วย

ชุดองค์ประกอบที่เรียบง่ายและสวยงาม

https://unitscss.com/

เอกสาร

ภาษาอังกฤษ / 日本語

คุณสมบัติ

หน่วยเป็นชุดองค์ประกอบที่เรียบง่ายและสวยงาม สิ่งที่คุณต้องทำคือโหลดไฟล์ CSS คัดลอกและวางตัวอย่างง่ายๆดังนั้นทุกคนสามารถใช้งานได้

  • ใช้อย่างรวดเร็ว
    สิ่งที่คุณต้องทำก็แค่ใส่ units.css มีการเตรียมส่วนประกอบหลายอย่างแล้วและคุณสามารถเลือกส่วนประกอบที่คุณต้องการใช้และนำไปใช้กับเว็บไซต์ของคุณ

  • เรียบง่ายและสวยงาม
    แต่ละส่วนประกอบได้รับการออกแบบอย่างสวยงาม การออกแบบจะได้รับการปรับปรุงเป็นระยะเราจะไม่ใช้การเปลี่ยนแปลงครั้งใหญ่ แต่ใช้การเปลี่ยนแปลงเล็กน้อยเช่นการปรับระยะขอบ

  • รองรับเบราว์เซอร์ที่ทันสมัย
    หน่วยได้รับการปรับให้เหมาะสมเพื่อใช้กับเบราว์เซอร์ที่ทันสมัยเช่น Microsoft Edge, Google Chrome, Firefox, Safari, เบราว์เซอร์เก่าล่ะ? ... ฉันเสียใจ.

  • การออกแบบเว็บตอบสนอง
    เราใช้การออกแบบเว็บที่ตอบสนองต่อการออกแบบเพื่อแสดงการออกแบบที่ดีที่สุดในอุปกรณ์ทั้งหมด

  • อัปเดตเป็นระยะ
    หน่วยยังคงเป็นรุ่นเบต้ามันจะได้รับการอัปเดตเป็นรุ่นเป็นระยะ ๆ UNITIL เวอร์ชันหลักเราจะเพิ่มส่วนประกอบใหม่เพิ่มประสิทธิภาพของรหัสแหล่งที่มาปรับการออกแบบ

  • สนับสนุนภาษาญี่ปุ่น
    เพราะนักพัฒนาเป็นภาษาญี่ปุ่นที่เราสามารถสนับสนุนเป็นภาษาญี่ปุ่น เราได้รับการปรับปรุงเว็บเพจและอัปเดตเอกสารที่เขียนเป็นภาษาญี่ปุ่น

การติดตั้ง

ตัวเองสามารถดาวน์โหลดได้จาก GitHub โดยการโคลนนิ่งหรือเป็นรูปแบบซิปหรือคุณสามารถดาวน์โหลดได้ผ่าน NPM 

$ git clone https://github.com/kokushin/unitscss.git
$ npm install unitscss --save

มาโหลดไฟล์ที่จำเป็น 

 < link rel =" stylesheet " href =" https://fonts.googleapis.com/css?family=Roboto:400,700 " >
< link rel =" stylesheet " href =" path/to/units.min.css " >

< script src =" path/to/units.min.js " > </ script >

การใช้งาน

เขียนตัวอย่าง HTML ที่แน่นอนและให้คลาสที่เหมาะสมเริ่มต้นด้วย uc- ตัวอย่างเช่นในตัวอย่างด้านล่างคุณสามารถสร้างส่วนประกอบการ์ดที่แนบมากับภาพที่ครอบคลุม 

 < div class =" uc-card _float " >
  < div class =" uc-card-image " style =" background-image:url(https://source.unsplash.com/random) " > </ div >
  < h3 class =" uc-card-title " > Sample card </ h3 >
  < p > Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aspernatur, et. </ p >
  < div class =" uc-btn _primary " > < a href =" # " > Button </ a > </ div >
</ div >

มันจะปรากฏบนเบราว์เซอร์เช่นนี้:

การสาธิต

https://unitscss.com/themes/

ตัวอย่าง

โปรดตรวจสอบ codepen

การดาวน์โหลด

ดาวน์โหลด Zip

คนอื่น ๆ

https://github.com/kokushin/units

ผู้สนับสนุน

@kokushin

ใบอนุญาต

รหัสและเอกสารลิขสิทธิ์ 2017 โดย Kokushin รหัสที่เผยแพร่ภายใต้ใบอนุญาต MIT

ขยาย
ข้อมูลเพิ่มเติม
แอปที่เกี่ยวข้อง
แนะนำสำหรับคุณ
ข้อมูลที่เกี่ยวข้อง ทั้งหมด