عندما نتصفح العديد من مواقع الويب، سنرى أنه في بعض مواقع الويب، عندما تتحرك الماوس فوق النص الموجود في شريط التنقل، ستشعر أن الكلمات تتحرك، أو أن لون الخط سيتغير، أو
سيكون هناك خط فوقي انظر إلي، لقد فهمت تأثير شريط التنقل على مدونتي، واليوم سيخبرك سان شاو بكيفية تحقيق ذلك.
في الواقع، هذا بسيط جدًا، ويتم تنفيذه فعليًا باستخدام CSS، يرجى اتباع خطواتي، هيا بنا!
1. أدخل إلى إدارة البوابة الشخصية الخاصة بك، وحدد إعدادات البوابة الشخصية، ثم حدد اختيار القالب، وحدد CSS المخصص للدخول.
2. هل شاهدت بعض أكواد CSS، الرجاء العثور على الكود التالي:
body{
Margin-top: 0px;
الهامش الأيمن: تلقائي؛
الهامش السفلي: 0px؛
الهامش الأيسر: تلقائي؛
العرض: 956 بكسل؛
لون الخلفية: #336666؛
حجم الخط: 12 بكسل؛
اللون: #666666؛
}#navi_bar أ:الرابط {
/*لون نص شريط التنقل*/
}#navi_bar a:visited {}
حسنًا، فيما يلي الخطوات الأساسية:
أضف الكود التالي بعد ذلك:
#navi_bar a:hover{color:#000000;font-weight:bold;text-decoration:blink;background:#FF0000;font-size:18px}
#navi_bar أ{عرض:كتلة}
وصف الرمز: 1. يمثل اللون لون الكلمة عند تحريك الماوس، وتمثل زخرفة النص تأثير تعديل النص. السمات التي يمكن تحديدها هي (لا شيء يعني أن
الارتباط التشعبي
لا يحتوي على تسطير، والتسطير له تسطير، ويضيف خط فوقي ارتباطًا تشعبيًا إلى النص،ثم قم بالتغيير إلى سطر لإضافة خط إلى النص المرتبط تشعبيًا، ووميض لجعل النص
يومض
).حجم الخط يمثل حجم الخط. إذا كنت تريد جعل شريط التنقل ديناميكيًا، فإن حجم الخط هنا
أكبر من الخط الموجود في navi_bar a:link. حجم الخط في تعريف CSS هو 14 بكسل، لذلك نحن بحاجة إلى الاختيار خط أكبر من 14 بكسل.
2.navi_bar a{display:block} يعني أن اللون يملأ الجدول بأكمله، وإلا يمكن ملء النص فقط.