אני לא חושב שאפשר לקרוא לזה "מהדר", כי CSS היא לא בדיוק שפת תכנות.

אני מניח שאתה מחפש אופציה כמו intellisense שזה מציע לך הצעות כאשר את כותב את הקוד בהתאם לאותיות הראשונות שבחרת ואז משלים את הקוד במהירות כאשר ביצעת בחירה, וגם אופציה לצפייה מהירה לאיך נראים בפועל השינויים שאתה עושה. בקטע הזה ללא ספק dreamweaver הוא אחד המתקדמים בשוק… אבל כל זאת יש כמה כלים חינמיים שתוכל לבדוק. הנה 2 ה"תותחים" היותר כבדים ורציניים:

Microsoft WebMatrix – כלי חינמי ועוצמתי מבית מיקרוסופט התומך בכל השפות הנפוצות של פיתוח אתרים כמו CSS, HTML ו Javascript וגם בשפות צד שרת כמו net. ואפילו PHP ! עם התקנה מותקן גם שרת IIS שבעזרתו תוכל לראות מידית את תוצאות העבודה שלך (רלוונטי יותר לשפות צד השרת). בתוכנה זו אתה כותב את הקוד שלך ובסיום לוחץ על Run למעלה ורואה את התוצאות בדפדפן שלך.

Visual Studio – Web Developer 2010 Express – עוד כלי חינמי מבית מיקרוסופט, איתו מקבלים גם את סביבת העבודה הנוחה והמאובזרת של visual studio. בתוכנה זו מתמקדים בעיקר בטכנולוגיות של מיקרוסופט כמו net., ASP ו #C, ואין תמיכה ב PHP למשל. אך ישנה אפשרות לערוך קבצי HTML, לקשר אליהם CSS וגם לצפות בתוצאה ואפילו לערוך בעזרת ה Design View – כך שזה דיי מתקרב ל Dreamweaver, רק בחינם (לא צריך לפתוח את הדפדפן, רואים את העיצוב והשינויים מיידית בתוך התוכנה).

טוב, קשה להתחרות במיקרוסופט… אבל עדיין יש לי מספר המלצות:

BlueGriffon - עורך HTML שיכול לעזור המון בכתיבת CSS.

WebPutty - אתר אינטרנט שמאפשר לך לערוך CSS ולצפות מיידית בתוצאות, ומאפשר לך לגשת אליו מכל מקום.

מעבר ל"מהדר", ישנו כלי נוסף שקשה להסתדר בלעדיו, והוא משמש בעיקר לתיקונים קטנים לאחר שכבר פחות או יותר כתבת את ה CSS שלך. מדובר על תוסף גאוני ל Firefox בשם FireBug, אך להבנתי ניתן להתקין אותו בדפדפנים נוספים. התוסף הזה מאפשר לך לראות את קוד ה CSS של כל אתר (ואפילו את הדף שאתה בונה…), לשנות אותו ולראות את השינויים LIVE בדפדפן. אז אתה משנה הגדרות ומאפיינים, מזיז שמאלה ימינה, משנה צבע פה ושם, וכשהגעת לתוצאה הרצויה אתה מעתיק את השינויים לקובץ המקור שלך. גאוני.

דרך אגב, יש כלי דומה שמוטמע גם ב EXPLORER וב- CHROME, אם אני לא טועה לחיצה על F12 במקלדת מקפיצה אותו.