פרסומת

תבניות CSSאני עובד על האינטרנט כבר זמן מה, ולמעשה מצאתי שקל יותר לכתוב כל מסמך בפורמט HTML במקום DOC או TXT. אם אתה משתמש ב-Google Docs, אתה למעשה עושה את אותו הדבר, מכיוון ש-Google Docs הפך (למרבה המזל) למעשה לעורך HTML של WYSIWYG. יצירת כמה תבניות מסמכים באמצעות HTML ו-CSS היא קלה מאוד, יכולה להיעשות על ידי כולם, ואם תעשה זאת נכון, זה ייראה אותו דבר לכולם.

למה להשתמש ב-HTML?

הסיבה הכי גדולה שלי ללכת על מסמכי HTML ו-CSS בלבד היא שזה כנראה הפורמט התואם ביותר על פני דפדפנים ומערכות הפעלה, למעט פורמט PDF, שקשה מאוד ו/או יקר לביצוע נו. השימוש ב-Microsoft Office הוא גם לא הטוב ביותר. אני משתמש ב-Office 2007 שמשתמש בהרבה תכונות נוספות שאינן נתמכות על ידי גרסאות קודמות, כך שהאיכות עשויה להיות מופחתת. מי יודע איך ייראו המסמכים האלה ב-Open Office למשל? אם אתה יוצר מסמך HTML שנראה בדיוק אותו הדבר ב-Internet Explorer ו-Firefox שיצרת מסמך שניתן לפתוח על ידי משתמשי Mac, Linux ו-Windows, ויראה אותו הדבר ב-99% מה דפדפנים.

מה זה CSS ו-HTML?

אם אתה חדש בכל עניין ה-HTML ו-CSS הזה, אל תיבהל. זה קל מאוד, ואתה יכול למצוא הרבה משאבים באינטרנט שיעזרו לך. קוד HTML ו-CSS הם מה שמרכיב את רוב מה שאתה רואה בדף הזה כאן, HTML שולט בתוכן, בעוד CSS שולט בסגנון או איך התוכן מוצג.

איך אני יכול ליצור תבנית?

דוגמה בסגנון CSS

ובכן, תצטרך ללמוד קצת קוד. למרבה המזל, HTML ו-CSS קל מאוד להבנה. כדי לתת לאובייקט גבול למשל, פשוט הקלד

גבול: 1px שחור מוצק

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



<p><em>כותרת הדף נכנסת לכאן</em></p> <p></p>


התוכן של הדף שלך נכנס לכאן.


לאחר מכן תוכל למלא את כל זה בתוכן ובסגנון כדי ליצור את המסמך שלך. הבט ב דוגמה 1, דוגמה 2 ו דוגמה 3 עשיתי. קחו בחשבון שהקוד בגוף, התוכן זהה לחלוטין, אני רק משנה את קוד ה-CSS. זה מראה שאתה יכול להשתמש בסטיילינג כדי ליצור מראה שונים במהירות.

למה זה כל כך נהדר?

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

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

כמו כן, מכיוון של-Google Docs יש כעת תמיכה מלאה ב-CSS, אתה יכול פשוט להעתיק ולהדביק את קוד הסגנון שלך ב-Docs ו שנה את המראה של המסמכים שלך מבלי שתצטרך להסתובב ולעצב כל כותרת אחת ב-a זְמַן.

איפה אני יכול ללמוד עוד?

כפי שאמרתי, CSS הוא כלי פשוט, אך הוא דורש ידע בסיסי בכל זאת. HTML הוא גם הגיוני וקל ללמידה, אני ממליץ W3Cschools בשביל שניהם. למדתי שם הרבה ממה שאני יודע היום, לצרכים בסיסיים זה אחד האתרים הטובים ברשת. W3C מפתחת גם את תקני האינטרנט, כך שאתה יכול להיות בטוח שכל מה שהם כותבים בדף שלהם עובד.

עמוד נוסף שפעם למדתי ממנו הרבה היה מקור ה-HTML שלך. עמוד זה מכיל HTML ו-CSS, וגם כמה טיפים מתקדמים על קידוד, קידום, נגישות ובכלל איך ליצור אתר טוב. יש לו עזרה מצוינת ב-CSS, בהחלט שווה ביקור.

לבסוף אתה יכול להסתכל על כמה בלוגים ומאמרים קשורים כמו הסיכום המדהים הזה של טכניקות CSS חיוניות ו 53 טכניקות שאתה לא יכול לחיות בלעדיהם.