مرحبا أصدقاء...اليوم اعرضه رهيبة جديدة تبحث عن مدونات بلوجر "نوع الاضافة CSS3 نمط القائمة المنسدلة".هذه مهنية يبحث سلسه القائمة منسدلة التي تم إنشاؤها مع CSS3.وسوف تجعل مدونتك أكثر جمالا وجاذبية.وهذا هو الحال قائمة كبيرة التي يجب أن يكون لديك على مدونتك والحصول على اكثر الاضافات فى الصفحة الرائيسية
شرح الاضافة فى مدونتك
ازهب الى لوحه التحكم
ثم القالب
توسيع قوالب عناصر واجهة المستخدم
اعمل نسخه احطياطى
الآن اضغط على
والبحث عن الكود أدناه
]]>
الآن قم بلصق أدناه الكود البرمجية أعلاه فقط/قبل ذلك
.preload1 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqRwG_npnhT19Z17suytlepKQAGBrAnya2JN7rTTobyktOrqeZjR9c-9jyJosH2HMu74LxFuANUfx9hYPvv9rMKLqqrGUvztuxQ2XY4NQQFijOfmcsTdRrZR7jzi5CRgNiUgMpp2rr8C0/s1600/blank_over.gif);}
.preload2 {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXw2A9mceZypMHtpgGVBI5KM2P4HDnHxm48zabShGofCouzG8480qmxEunDfBjbrKCDAiCU5YzxXNQomYwFpditqGSVXBR_ivcFGf9XLJZl49spQnzAcoUDPGhkwzG_ioYzkxrbZqybNM/s1600/blank_overa.gif);}
#nav {padding:0; margin:0; list-style:none; height:36px; background:#fff; position:relative; z-index:500; font-family:arial, verdana, sans-serif;}
#nav li.top {display:block; float:left;}
#nav li a.top_link {display:block; float:left; height:36px; line-height:27px; color:#ccc; text-decoration:none; font-size:11px; font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN4xsyvysa5i_gw4_d3VSb_UbtnxwivCOzmNmHbtPJzZJjr9KIYuzYlGnDKHlkEqa9Ueer9E0rX-J7kRFhqyfQS7vSI79SKgEqztDufyoaYqTAIHL1ZkZvfzyw5hEYQ6GkjuodVQ04g4E/s1600/blank.gif);}
#nav li a.top_link span {float:left; display:block; padding:0 24px 0 12px; height:36px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiN4xsyvysa5i_gw4_d3VSb_UbtnxwivCOzmNmHbtPJzZJjr9KIYuzYlGnDKHlkEqa9Ueer9E0rX-J7kRFhqyfQS7vSI79SKgEqztDufyoaYqTAIHL1ZkZvfzyw5hEYQ6GkjuodVQ04g4E/s1600/blank.gif) right top;}
#nav li a.top_link span.down {float:left; display:block; padding:0 24px 0 12px; height:36px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7niBvR1MfDrwiE3QoqmwFj62gYZIhmlqEnEsVs0FFkvTbCtRspfJQ98wyFcpwq6xvacLwwcwVWQL5G6DrxiUPeugDr5MPKHb4psNREiLCjAe5NYbp-8Pw42atfagIBZxQfeZUu6RWsR0/s1600/blanka.gif) no-repeat right top;}
#nav li a.top_link:hover {color:#fff; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqRwG_npnhT19Z17suytlepKQAGBrAnya2JN7rTTobyktOrqeZjR9c-9jyJosH2HMu74LxFuANUfx9hYPvv9rMKLqqrGUvztuxQ2XY4NQQFijOfmcsTdRrZR7jzi5CRgNiUgMpp2rr8C0/s1600/blank_over.gif) no-repeat;}
#nav li a.top_link:hover span {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqRwG_npnhT19Z17suytlepKQAGBrAnya2JN7rTTobyktOrqeZjR9c-9jyJosH2HMu74LxFuANUfx9hYPvv9rMKLqqrGUvztuxQ2XY4NQQFijOfmcsTdRrZR7jzi5CRgNiUgMpp2rr8C0/s1600/blank_over.gif) no-repeat right top;}
#nav li a.top_link:hover span.down {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXw2A9mceZypMHtpgGVBI5KM2P4HDnHxm48zabShGofCouzG8480qmxEunDfBjbrKCDAiCU5YzxXNQomYwFpditqGSVXBR_ivcFGf9XLJZl49spQnzAcoUDPGhkwzG_ioYzkxrbZqybNM/s1600/blank_overa.gif) no-repeat right top;}
#nav li:hover > a.top_link {color:#fff; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqRwG_npnhT19Z17suytlepKQAGBrAnya2JN7rTTobyktOrqeZjR9c-9jyJosH2HMu74LxFuANUfx9hYPvv9rMKLqqrGUvztuxQ2XY4NQQFijOfmcsTdRrZR7jzi5CRgNiUgMpp2rr8C0/s1600/blank_over.gif) no-repeat;}
#nav li:hover > a.top_link span {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhqRwG_npnhT19Z17suytlepKQAGBrAnya2JN7rTTobyktOrqeZjR9c-9jyJosH2HMu74LxFuANUfx9hYPvv9rMKLqqrGUvztuxQ2XY4NQQFijOfmcsTdRrZR7jzi5CRgNiUgMpp2rr8C0/s1600/blank_over.gif) no-repeat right top;}
#nav li:hover > a.top_link span.down {background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXw2A9mceZypMHtpgGVBI5KM2P4HDnHxm48zabShGofCouzG8480qmxEunDfBjbrKCDAiCU5YzxXNQomYwFpditqGSVXBR_ivcFGf9XLJZl49spQnzAcoUDPGhkwzG_ioYzkxrbZqybNM/s1600/blank_overa.gif) no-repeat right top;}
/* Default list styling */
#nav li:hover {position:relative; z-index:200;}
/* keep the 'next' level invisible by placing it off screen. */
#nav ul,
#nav li:hover ul ul,
#nav li:hover ul li:hover ul ul,
#nav li:hover ul li:hover ul li:hover ul ul,
#nav li:hover ul li:hover ul li:hover ul li:hover ul ul
{position:absolute; left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; list-style:none;}
#nav li:hover ul.sub
{left:0; top:31px; background: #fff; padding:3px; border:1px solid #3a93d2; white-space:nowrap; width:90px; height:auto; z-index:300;}
#nav li:hover ul.sub li
{display:block; height:20px; position:relative; float:left; width:90px; font-weight:normal;}
#nav li:hover ul.sub li a
{display:block; font-size:11px; height:20px; width:90px; line-height:20px; text-indent:5px; color:#000; text-decoration:none;}
#nav li ul.sub li a.fly
{background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4p2FC3eNbc_puz76fK9_CEtlTClci-FmoTIFSAREQ8MM44p58jtVAUaARj4WFCKvvjKtF43doa_HytDMEI3v74gUFqmjNK68fX_7NyTNPOtyOSkdJwoOidE2Dl71XrI4WnR0qGlsM4zg/s1600/arrow.gif) 80px 7px no-repeat;}
#nav li:hover ul.sub li a:hover
{background:#3a93d2; color:#fff;}
#nav li:hover ul.sub li a.fly:hover
{background:#3a93d2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYuuCz0de-1_6pRPJvS2829vOpP-yQA3a6-27jL_aOvN2Sg2XiPaxMDbeHnL-OjYM6fnmpNCQpLmxzoDLBXPQ9tPyn-7v7WEd9EQ5yR3U4tPKn720g0fkeWAGOMyFTYCchzrVu-res2us/s1600/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
#nav li:hover ul li:hover > a.fly {background:#3a93d2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYuuCz0de-1_6pRPJvS2829vOpP-yQA3a6-27jL_aOvN2Sg2XiPaxMDbeHnL-OjYM6fnmpNCQpLmxzoDLBXPQ9tPyn-7v7WEd9EQ5yR3U4tPKn720g0fkeWAGOMyFTYCchzrVu-res2us/s1600/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
#nav li:hover ul li:hover ul,
#nav li:hover ul li:hover ul li:hover ul,
#nav li:hover ul li:hover ul li:hover ul li:hover ul,
#nav li:hover ul li:hover ul li:hover ul li:hover ul li:hover ul
{left:90px; top:-4px; background: #fff; padding:3px; border:1px solid #3a93d2; white-space:nowrap; width:90px; z-index:400; height:auto;}
إضافة كود HTML:
انتقل إلى لوحة التحكم الرئيسية مدونة > تخطيط > إضافة أداة > HTML/جافا سكريبت
الآن قم بلصق التعليمات البرمجية HTML التالية في مجال تكنولوجيا المعلومات
0 التعليقات :
إرسال تعليق