نصيحتان حول تطبيق أوراق أنماط CSS في DreamWeaver
الكاتب：Eve Cole
وقت التحديث：2009-05-31 21:17:47
1. قم بإزالة التسطير من الارتباط التشعبي وقم بتغيير اللون عند تمرير الماوس فوق الارتباط التشعبي:
افتراضيًا، يتم وضع خط تحت الارتباطات التشعبية الموجودة في صفحات الويب المصممة باستخدام DreamWeaver، الأمر الذي لا يبدو جميلًا جدًا. لإزالة هذه التسطيرات المزعجة، تتمثل الطريقة المقدمة في العديد من الصحف والمجلات في إضافة جزء من التعليمات البرمجية يدويًا إلى التعليمات البرمجية المصدر لـ HTML. وفي الواقع، من السهل إزالة التسطيرات السفلية للارتباطات في DreamWeave. أولاً، قم بإنشاء رابط عشوائي في مستند Windows الخاص بـ DreamWeaver. يمكنك أن ترى أنه سيتم وضع خط تحت هذا الارتباط. كيفية إزالة هذا التسطير؟
1. انقر فوق "نص" |. "أنماط CSS" |. "تحرير ورقة الأنماط..." في شريط القائمة (أو اضغط مباشرة على مفتاح الاختصار Ctrl+shift+E) لإظهار نافذة حوار تحرير ورقة الأنماط.
2. انقر فوق "جديد"، ثم في مربع الحوار "نمط جديد"، انقر فوق الزر "استخدام CSS Selector".
3. اكتب a في حقل المحدد، ثم انقر فوق موافق.
4. بعد ذلك، ينبثق مربع الحوار "تعريف نمط CSS" في زخرفة فئة النوع، حدد لا شيء، ثم انقر فوق "موافق"، ثم انقر فوق "تم". ستلاحظ على الفور أن التسطير الموجود على الرابط قد اختفى في Document Windows. إذًا كيف يمكنك تغيير لون الرابط عند تحريك الماوس فوقه؟ كرر الخطوتين الأولى والثانية أعلاه. ثم انقر فوق السهم المنسدل بجوار المحدد، وحدد "a:hover"، ثم انقر فوق "موافق". في مربع الحوار "تعريف النمط لـ: التحويم" الذي ينبثق، حدد أي لون بلون فئة النوع (على سبيل المثال، حدد اللون الأحمر)، ثم انقر فوق موافق، ثم انقر فوق تم للإكمال. اضغط على F12 لمعاينة الرابط ووضعه على الرابط. هل يتحول لون الرابط إلى اللون الأحمر؟ إذا قمت الآن في مربع الحوار "تعريف النمط لـ: التحويم" الآن، في فئة Backgroud، بتحديد لون الخلفية ليكون أخضر، فعند وضع الماوس على الارتباط التشعبي، لن يتحول الارتباط إلى اللون الأحمر فحسب، وهناك ستكون أيضًا خلفية خضراء. في الواقع، من خلال مربع حوار تعريف نمط CSS الآن، يمكنك أيضًا تحقيق المزيد من التأثيرات الخاصة، وقد يرغب الأصدقاء المهتمون في التفكير في الأمر.
2. قم بإنشاء ورقة أنماط CSS خارجية قابلة لإعادة الاستخدام بعد استخدام DreamWeaver لإنشاء نمط CSS في صفحة ويب معينة، إذا كنت تريد تطبيق النمط على صفحة ويب أخرى، فلن تحتاج إلى إعادة إنشاء نمط CSS أثناء قيامك بإنشاء ملف ورقة أنماط CSS خارجي (ورقة أنماط CSS خارجية)، يمكنك استدعاء الأنماط الموجودة في ملف ورقة الأنماط هذا متى شئت في المستقبل. لتسهيل الإدارة، قم أولاً بإنشاء مجلد جديد في المجلد الذي يوجد به الموقع، باسم CSS، والذي يستخدم خصيصًا لوضع ملفات أوراق الأنماط الخارجية (امتداده هو css).
1. اضغط على Ctrl+shift+E في نافذة المستند لإظهار نافذة الحوار "تحرير ورقة الأنماط" 2. انقر فوق "ارتباط".
3. في مربع الحوار Link External Style Sheet المنبثق، انقر فوق BROWSE وابحث عن مجلد CSS الذي قمت بإنشائه للتو.
4. في عمود "اسم الملف" في نافذة تحديد ملف ورقة الأنماط، اكتب *.css (* يمكن أن يكون بأي اسم). يرجى ملاحظة أنه لا يوجد في الواقع ملف ورقة أنماط في مجلد CSS في الوقت الحالي اكتب في حقل "اسم الملف" سيصبح اسم ملف ورقة الأنماط الخارجية الجديد. على سبيل المثال، اكتب title.css، ثم انقر فوق تحديد |
5. في نافذة الحوار تحرير ورقة الأنماط، ستتم إضافة title.css (رابط)، انقر عليه نقرًا مزدوجًا.
6. في النافذة المنبثقة "title.css"، انقر فوق "جديد".
7. في مربع الحوار "نمط جديد"، انقر فوق الزر "إنشاء نمط مخصص (فئة)". 8. اكتب اسمًا في عمود الاسم، مثل myheadline، ثم انقر فوق "موافق".
9. في مربع الحوار التالي "تعريف النمط لـ .myheadline في title.css"، قم بإجراء إعدادات مختلفة مثل الخط واللون، ثم انقر فوق "موافق" عند الانتهاء. إذا كنت تريد إنشاء نمط جديد، فانقر فوق "جديد" مرة أخرى، وكرر الخطوات 6 و7 و8 و9، وأخيرًا انقر فوق "حفظ" | "تم"، وسيتم إنشاء ملف ورقة الأنماط الخارجية title.css. سيتم إدراج جميع الأنماط في title.css في القائمة الفرعية "TEXT" |. "CSS Styles" في شريط القائمة. إذا كنت تريد استدعاء title.css هذا في صفحات ويب أخرى، فما عليك سوى تكرار الخطوات من 1 إلى 3 أعلاه، ثم أدخل title.css في عمود "اسم الملف" في نافذة تحديد ملف ورقة الأنماط. انقر على "تحديد" |. "موافق" |. "تم"، ستظهر جميع الأنماط الموجودة في title.css في القائمة الفرعية "النص" |. "أنماط CSS" في شريط القائمة بصفحة الويب، وستتمكن من تطبيقها إلى صفحة الويب هذه هذه الأنماط.
