Grid.css - מערכת רשת מינימלית עבור מפתחי אינטרנט

מסגרות Frontend גדול כמו Bootstrap לבוא עם שלהם הגדרות רשת משלו. אבל, הם גם לבוא עם הרבה מטען בצורה של אלמנטים מקוריים מתוכננים מראש ורכיבי JavaScript.

אם אתה מחפש מערכת רשת קטנה הרבה יותר יעיל אז אתה תאהב Grid.css.

זה ספריית קוד פתוח חינם מגיע ארוז עם המסורתי 12-רשת רשת קול כי אתה יכול מבנה עבור כל פריסה. CSS הוא באמת קל לשימוש ואת הקובץ עצמו רק צעדים 560 בתים (זה חצי קילומטר!)

תחילת העבודה היא סופר קל ואתה רק צריך קובץ CSS אחד נוסף לכותרת שלך.

אתה יכול למצוא את קישור להורדה ישירה בדף הבית של Grid.css או בריפו הרשמי של GitHub. אתה יכול אפילו להשתמש הגירסה גלם CDN כדי להטביע את הקובץ הזה ישירות GitHub ללא אירוח זה בעצמך.

עכשיו, אתה יכול להגדיר את מבנה העמודה באמצעות כל האלמנטים הרצויים (divs, חלקים, וכו ').

זה בדרך כלל כולל .שורה רכיב (הגורם המכיל) יחד עם רבים אלמנטים פנימיים. שיעורי הטור מספרים כדי להגדיר את החלל הכולל בתוך המיכל, כך למשל, .col4 תופס ארבעה טורים מתוך שנים-עשר.

הנה קטע טקסט לדוגמה מההדגמה:

אתה יכול להשתמש בכל שילוב של כיתות טור שאתה אוהב, כל עוד הם הוסף עד 12.

זה אומר שאתה יכול גם לבנות מחדש את הדף אם תרצה, באמצעות מכולות שורה שונים. לדוגמה, אתה יכול לקבל טווח אחד גדול עבור הכותרת שלך, אבל להשתמש בשתי שורות שונות / cols setup עבור דף הדף שלך.

כמובן, ספריה זו 100% בחינם ו קוד פתוח, כך שאתה חופשי לבצע עריכות כרצונך.

היוצר, אחמד טארק, גם עשה תירס אשר הוא גרסה של רבים ממשק המשתמש UI ערכות שם בחוץ. זה זוגות יפה עם Grid.css, אז הם שניהם ספריות מעולה להרים כאשר מתחיל פרויקט אינטרנט חדש.