דיון בנושא כתיבה נכונה של CSS

[bdoron]

נתקלתי בהרבה מיקרים בו אנשים אומרים לי מה היא הדרך הנכונה לרשום CSS בתוך דף HTML

ולכן פתחתי את הדיון הזה לכולכם בתקווה שבאמת תעזור לי להבין מה היא הדרך הנכונה

הבנתי שעדיף לרשום את הselectors בקובץ external file ולא בצורה של inline style

אחרי קריאה של מאמר הבנתי למה, מה שכן, אם למשל אני יוצר כפתור בגודל מסוים ואת הכפתור הזה אני רוצה למקם בתוך DIV אז מבחינת הגודל והצורה שלו באמת אפשר להשתמש בסלקטור מסוג CLASS אבל בו לא נשכח שאני רוצה למקם בתוך הDIV כל כפתור במקום שונה

אז הפתרון שלפי הבנתי הוא לרשום את הגודל של הכפתור בקובץ נפרד ואז להשתמש בו כCLASS באותו אלמנט שאני רוצה , ולהוסיף לאותו אלמנט inline css שמגדיר לו את המיקום המדוייק

אני צודק?

איך אתם בעבודה שלכם מציבים אובייקטים בתוך div?

האם בשביל כל אובייקט ואובייקט אתם יוצרים class מיוחד בשבילו ? או id?

מה הוא הנכון?

מה גם יש לי פה עוד סוגיה לגבי properties בתוך הrule שאני מגדיר

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

אז אחרי קריאה הבנתי שאני צריך להשתמש בהגדרת הגודל לפי קנה מידה אחוזים

הבעיה היא שכאשר אני נותן גודל לפי אחוזים הוא לא מתעדכן לי בדף אלא אם כן אני מוסיף לפני זה position absolute

בכל אופן אני אשמח אם תעשו לי קצת סדר בדברים

החל מהיכן רושמים CSS

איך אני ממקם דברים בשביל שהאתר שלי יהיה בכל הרזולוציות אותו דבר

והאם זה נכון שאני מיישם בצורה נכונה את כל נושא הקנה מידה, כי אם באמת אני צריך להשתמש באחוזים למה הם לא מגיבים לי כמו שצריך אלא אך ורק אם אני מוסיף position : absolute

[stas4000]

מה שאתה מחפש נקרא Responsive CSS, לדעתי אם תחפש את זה בגוגל זה יענה לך על הרבה שאלות

[Gil28]

אתה צריך גם לחשוב קצת.

תמיד עדיף ליצור קובץ נפרד עם הגדרות ה-CSS, גם אם מדובר באלמנט בודד.

ככה אתה יוצר הפרדה לוגית בין תוכן לעיצוב. דוגמה טובה: האתר http://www.csszengarden.com/ בנוי ככה שעבור קוד HTML אחד משתמשים במספר קבצי CSS שונים והעיצוב משתנה דרסטית (בקוד ה-HTML לא משתנה כלום!)

בנוסף, ככה ניתן לבצע caching לקובץ ה-CSS אם לא משתנה בו דבר. למשל, קח את עמוד הבית של HWzone. העיצוב שלו קבוע - מה שמשתנה בו זה התוכן עצמו שמקודד ב-HTML. כשאני טוען את האתר, אני מוריד את קובץ ה-HTML (וה-javascript וכולי אם צריך) ואת קובץ ה-CSS לא כי כבר יש לי אותו מהפעם הקודמת ולא התרחש בו שום שינוי. ככה האתר נטען מהר יותר כי יש פחות תעבורת רשת.