4. יצירת דף סגנון
לפני שניצור את החוק הראשון, אשר יציג את הרקע של העמודים באתר שלנו, אנחנו צריכים ליצור את דף הסגנון.
יצירת דף סגנון:
אנו כבר יודעים שדף סגנון הוא פשוט קובץ טקסט.
אם אתם משתמשים בעורך טקסט
1. הפעילו כל כלי לעריכת טקסט שיש לכם וצרו מסמך חדש.
2. יתחו מסמך חדש ( בד"כ הפעלת היישום תגרו לפתיחה אוטומטית של מסמך חדש.)
האם אתם משתמשים בכלי מסוג WYSIWYG , כמו אשף הסגנון
1. הפעילו את היישום
2. פיתחו חלון דפ סגנון חדש ( בד"כ הפעלת היישום תגרו לפתיחה אוטומטית של חלון חדש.)
שמירת דף הסגנון
אני מקווה שאתם נוהגים ליצור את כל האתר שלכם בתוך ספריית שורש (תיקייה). כל עמוד, תמונה, או פריט אחר באתר שלכם צריכים להיות שמורים בתיקייה זו. ואז כשאתם טוענים את האתר שלכם, אתם פשוט טוענים את ספריית השורש וכל האתר שלכם נטען במלואו: קישורים, תמונות וכולי. בגלל שדפי סגנון מקושרים לעמודים, כפי שנלמד בהמשך, אנו צריכים לוודא שכל דפי הסגנון של האתר שלמו נמצאים גם הם בספריה השורשית של האתר.
לגבי תמונות, ניתן לשים אותן בכל מקום במסגרת מבנה ספרייה זה, אבל משום שנפתח דף סגנון גרעין, שיהיה מיושם בכל האתר, מקומו בתוך ספריית השורש.
1. קראו לדף הסגנון core-style.css ושימרו אותו בספריית השורש של האתר שלכם.
שאינו מכיל דבר עדיין, יצרתם את דף הסגנון הראשון שלכם. חזק ואמץ. שלא כמו למסמכי HTML, לדפי סגנון אין כותרת מידע מתוחכמת או קוד מיוחד כדי להראות לדפדפן מהם.
צרו דף באינטרנט
הדבר באחרון שאתם צריכים לעשות לעכשוו הוא ליצור דף באינטרנט ולשמור אותו בתיקיית האתר. נשתמש בו כדי לראות איך מתקדמת העבודה שלנו. הנה אתר ברשת שאולי תרצו להשתמש בו. יש בו את כל תגי ה-HTML שנצטרך במסגרת השיעורים האלה.
<HTML>
<HEAD>
<TITLE>Choux</TITLE>
<LINK REL=STYLESHEET TYPE="text/css" HREF="core-style.css">
</HEAD>
<BODY>
<H1>Classic Patisserie Recipes</H1>
<H2>Pastry Cream</H2>
<P>Also known as creme patissiere, this is the traditional filling
for <A HREF="fruit_tarts.html">fresh fruit tarts</A>. It is also used
to fill <A HREF="choux_puffs.html">choux puffs</A>.</P>
<H3>Ingredients</H3>
<P>2 cups milk</P><
<P>1 vanilla bean</P>
<P>6 egg yolks</P>
<P>175g castor sugar</P>
<P>50g cornflour</P>
<H3>Method</H3>
<P>Scald milk with vanilla bean. Beat egg yolks with cornflour until
thick. Pour in milk and whisk until quite smooth.</P>
<H1>More Information</H1>
<P>to contact the author, email me on
<A HREF="mailto:john@masterchef.org">john@masterchef.org</A></P>
<P>to download all my recipes in acrobat format,
<A HREF="ftp://ftp.masterchef.org/recipes.pdf">click here</A></P>
<P>for other recipes, see biodynamic recipes from
<A HREF="http://www.biodyn.nu">http://www.biodyn.nu</A></P>
</BODY>
</HTML>
וצריך להכניס ל - HEAD:
><LINK REL=STYLESHEET TYPE="text/css" HREF="core-style.css">
נלמד על קישור לדפי סגנון בשיעור מאוחר יותר, בינתיים, אתר האינטרנט הזה מקושר לדף סגנון בשם core-style.css, והוא וקובץ ה-HTML (לא משנה איך תקראו לו) נמצאים באותה תיקייה.
הדבר הבא
עכשיו שיצרנו את דף הסגנון שלנו, הגיע הזמן לקבוע כמה חוקים.. נתחיל ביצירת רקע למסמך שלנו
|