آموزش تصویری Dreamweaver CS5 قسمت 3

[learninweb]

در ادامه چند خط ديگر متن وارد ميکنيم.


Welcome to Eniacmedia.com

This webpage is produced by Dreamweaver CS3! You are learnig Macromedia Dreamweaver CS3 by Eniac interactive CD's. For more information about HTML language you can use learning HTML, JavaScript & CSS CD. All of the 3 titels are just in one CD! It's a good choise to buy this CD!

همانطور که مشاهده ميکنيد متن بصورت يک پاراگراف مستقل و تراز از سمت راست نمايش داده شده است. براي آنکه متن بهتر نمايش داده شود ميخواهيم تراز آن را تغيير دهيم. ابتدا بايد متن مورد نظر را انتخاب کنيم. دکمه Shift صفحه کليد را فشرده نگهداشته و سپس دکمه Home را فشار دهيد.
دکمه Shift را فشرده نگهداشته و دو بار کليد حرکت مکان نما به سمت بالا را فشار دهيد.
براي آنکه اين متن تراز شود روي منوي Format کليک کنيد.




بر روي گزينه Align کليک کنيد.




روي Justify کليک کنيد.




در اين متن چند غلط املايي نيز وجود دارد. با استفاده از امکان Check Spelling اين نرمافزار ميتوانيد بصورت خودکار آن را پيدا کنيد. براي اين کار منوي Commands را باز کنيد.




براي بررسي غلط‌هاي املايي روي گزينه Check Spelling کليک کنيد.




مشاهده ميکنيد که اولين غلط املايي پيدا شد. طبق فرهنگ لغت نرم افزار Dreamweaver در کلمه webpage بايد بين دو حرف web و page يک فاصله اضافه شود. روي دکمه Change کليک کنيد تا اين تغيير انجام شود.




مشاهده ميکنيد که کلمه webpage به web page تغيير يافته است. کلمه learning نيز به اشتباه learnig تايپ شده است و يک حرف n در آن جا افتاده است. براي درست کردن اين کلمه در ليست روي عبارت درست دبل کليک کنيد.




اکنون مشاهده ميکنيد که کلمه titlesنيز اشتباه تايپ شده است. روي دکمه Change کليک کنيد.




کلمه Choice نيز به اشتباه با S نوشته شده است. چند کلمه در قسمت Suggestions به شما پيشنهاد شده است که ميتوانيد از آنها استفاده کنيد کلمه Choice نيز در داخل اين ليست وجود دارد. روي گزينه Choice دابل کليک کنيد.

---

به همين ترتيب براي دو گزينه دوم و سوم نيز عمل ميکنيم. البته ميتوانستيم تمامي سه گزينه را انتخاب کنيم و سپس از دکمه Ordered List استفاده کنيم.
به غير از اين دو حالت حالت‌هاي ديگري نيز وجود دارد که ميتوانيد آنها را از طريق پنجره List Properties انتخاب کنيد. براي مشاهده اين پنجره منوي Format را باز کرده و سپس منوي فرعي List را باز کنيد و گزينه Properties را انتخاب نمائيد
در محيط نرمافزار Dreamweaver ميتوانيد فونت متن هايي که تايپ ميکنيد را تغيير دهيد. براي مثال ميخواهيم فونت خط اول را تغيير دهيم. در ادامه خط اول را انتخاب ميکنيم.
بر روي آيکون CSS کليک کنيد.

---

بر روي ليست بازشونده Font کليک کنيد.




اکنون ميتوانيد يک سري از فونت‌ها را مشاهده کنيد. روي گزينه Arial, Helvetica, sans-serif کليک کنيد.




اکنون بايد يک کلاس در CSS تعريف کنيم و ويژگي مورد نظر خود را در اين کلاس تعريف کنيم. ابتدا بايد نامي براي اين کلاس انتخاب کنيد. عبارت Class1 را تايپ کنيد.
بر روي دکمه OK کليک کنيد.




با اين کار فونت متن را تغيير داده‌ايم. توجه کنيد که فونتي که انتخاب ميکنيد بايد در کامپيوتر کاربر وجود داشته باشد در غير اين صورت متن با يکي از فونت‌هاي پيش‌فرض نمايش داده ميشود. دوباره روي ليست باز شونده Font کليک کنيد.




اکثر فونت‌هايي که در اين ليست وجود دارند بر روي تمامي کامپيوترها موجود هستند در صورتيکه بخواهيد ميتوانيد يک فونت جديد نيز به اين ليست اضافه کنيد. براي اين کار روي گزينه Edit Font List کليک کنيد.




در اين قسمت فونت‌هاي نصب شده در کامپيوتر شما نمايش داده شده‌اند و ميتوانيد فونت مورد نظر خود را انتخاب کنيد.
روي فونت Tahoma کليک کنيد.




روي دکمه مشخص شده کليک کنيد. تا فونت به ليست سمت چپ اضافه شود.




به همين ترتيب ميتوانيد چند فونت ديگر نيز به ليست سمت چپ اضافه کنيد تا درصورتيکه فونت اول وجود نداشت از فونت دوم استفاده شود. در صورتيکه ليست فونت‌هاي آماده را نگاه کنيد آنها نيز شامل چند فونت هستند. روي دکمه OK کليک کنيد.




اکنون در صورتيکه ليست باز شونده Font را باز کنيد فونت اضافه شده در اين ليست وجود دارد.
در محيط نرمافزار Dreamweaver ميتوانيد اندازه فونت متن‌هايي که تايپ ميکنيد را تغيير دهيد. براي مثال ميخواهيم اندازه فونت کلمهEniac بزرگتر شود. روي کلمه Eniac دابل کليک کنيد.

---

روي ليست باز شونده Size کليک کنيد.




در اين ليست از عدد 9 تا 36 را ميتوانيد انتخاب کنيد. البته عددي مثل 11 در اين ليست وجود ندارد که ميتوانيد آن را در جعبه متن ليست باز شونده Size تايپ کنيد. با استفاده از گزينه Small فونت را کوچکتر ميکنيد. هر چه تعداد xهاي کنار گزينه بيشتر باشد فونت مقدار بيشتري کوچک ميشود. با استفاده از گزينه Large نيز فونت بزرگتر ميشود. روي گزينه x-Large کليک کنيد.




در اين جا ما نام Class2 را براي اين کلاس CSS انتخاب کرده ايم. بر روي دکمه OK کليک کنيد.




با اين کار کلمه Eniac بزرگتر شده است. اين کار باعث ميشود که اين کلمه در متن بيشتر نشان داده شود و تأکيد بيشتري بر آن بشود.
ميخواهيم اين کلمه بصورت مورب و قرمز نمايش داده شود. براي اين کار روي دکمه Italic کليک کنيد.




مشاهده ميکنيد که متن بصورت مورب نمايش داده شده است. براي تغيير رنگ متن روي دکمه Text Color کليک کنيد.




روي رنگ قرمز مشخص شده کليک کنيد.




مشاهده ميکنيد که اکنون رنگ متن به رنگ قرمز تبديل شده است. بجاي تعيين رنگ ميتوانيد کد رنگ را در جعبه متن کنار دکمه Text Color نيز وارد کنيد. اين کد بصورت هگزادسيمال و RGB ميباشد. در صورتيکه بخواهيد اندازه اين متن به حالت اوليه برگردد ميتوانيد از ليست باز شونده Size گزينه None را انتخاب کنيد. براي آنکه متن از حالت انتخاب خارج شود در قسمت مشخص شده کليک کنيد.‌




اکنون ميتوانيد کلمه Eniac را بهتر مشاهده کنيد. ميخواهيم در فاصله بين خط کنوني و خط بعدي يک خط افقي رسم کنيم. روي منوي Insert کليک کنيد.




روي گزينه HTML کليک کنيد.




روي دکمه Horizontal Ruler کليک کنيد.

---

مشاهده ميکنيد که يک خط افقي رسم شده است. در پنجره خصوصيات اين عنصر ميتوانيد ابعاد آن را تنظيم کنيم. داخل جعبه متن w کليک کنيد.




عدد 50 را تايپ کنيد.
روي ليست باز شونده مشخص شده کليک کنيد.




روي گزينه % کليک کنيد.




با اين کار تعيين کرديم که ميخواهيم طول اين خط برابر با 50% صفحه نمايش باشد. در صورتيکه گزينه Shading را غير فعال کنيد خط بصورت بدون سايه نمايش داده ميشود. امکان تغيير رنگ اين خط در زبان HTML و در نتيجه در نرمافزار Dreamweaver وجود ندارد.
براي مشاهده اين صفحه در کاوشگر کليد F12 را فشار دهيد.
روي دکمه Yes کليک کنيد.




در Dreamweaver ميتوانيد کاراکترهاي خاصي را در صفحه درج کنيد. براي اين کار بايد از منوي Insert سپس منوي فرعي HTML را باز کرده و منوي Special Characters را باز نمائيد. در اين منو يک سري کاراکترهاي خاص وجود دارند در صورتيکه کاراکتر مورد نظر شما در گزينه‌هاي اين منو وجود ندارد گزينه Other را انتخاب نمائيد.