معهد خبراء بلوجر

معهد خبراء بلوجر (https://www.bloggerexp.com/index.php)
-   إضافات وأدوات بلوجر (https://www.bloggerexp.com/forumdisplay.php?f=10)
-   -   طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html (https://www.bloggerexp.com/showthread.php?t=8046)

saidrahmani 06-09-2013 06:00 AM

طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html
 
السلام عليكم
اليوم مع دروس البلوجر

طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html
(قائمة منسدلة على بلوجر)

صور لإضافة:
1.


2.


شرح تركيب الإضافة:

اذهب إلى لوحة التحكم ثم قالب ثم تحرير HTML :



- ابحث عن : ]]></b:skin>

وألصق الكود التالي قبلها مباشرة:
[QUOTE]*{ margin:0 ; padding:0 ; text-decoration: none; font-family: Tahoma, Geneva, sans-serif; font-size: 12px; } body { background: Url(BG.PNG); } .KrissMenu { margin-top: 200px; } .KrissMenu ul { list-style: none; background: -webkit-linear-gradient(#292e32,#1F2326); height:40px; width: 320px; margin: auto; border-radius: 3px; box-shadow: 0 0 0 1px #080c0f, inset 0 1px 0 #414548 ; } .KrissMenu ul li { float: left; position: relative; } .KrissMenu ul li.li { height: 40px; border-left: 1px solid #080c0f; border-right: 1px solid #414548; } .KrissMenu ul li a { display: block; color: #bbb; padding:13px 20px; text-shadow: 0 1px 0 #0a0a0a ; font-weight: bold; } .KrissMenu ul li a:hover { background: -webkit-linear-gradient(bottom,#1D2124,#16171B); box-shadow: 0 0 10px #000 inset; } .KrissMenu ul li ul { list-style: none; position: absolute; width: auto; height: auto; background: #767d83; box-shadow: 0 0 5px #111; margin-top: 5px; top: 0; opacity: 0; visibility: hidden; -webkit-transition: all 1s ease; } .KrissMenu ul li ul li { float: none; } .KrissMenu ul li ul li a { color: #0a0b0d; text-shadow: 0 1px 0 #979fa1 ; } .KrissMenu ul li ul li a:hover { background: -webkit-linear-gradient(#565d63,#3e4347); box-shadow:0 0 0 1px #303538, inset 0 1px 0 #676e74 ; color: #d9dee2; text-shadow: 0 1px 0 #191d20 ; } .KrissMenu ul li ul li a:first-child { border-radius: 3px ; } .KrissMenu ul li:hover ul { visibility: visible; opacity: 1; top: 40px; }
]

- وبعد ذلك ابحث عن: <body>

وأضف الكود التالي بعده مباشرة (إن أردت أن يظهر في أعلى الصفحة):

اقتباس:

<div class="KrissMenu">
<ul>
<li><a href="#Index">Home</a></li>
<li class="li"></li>
<li><a href="#Contact">Contact</a></li>
<li class="li"></li>
<li>
<a href="#Blog">Blog</a>
<ul>
<li><a href="#Registre">Registre</a></li>
<li><a href="#Tuto">Tuto</a></li>
<li><a href="#News">News</a></li>
<li><a href="#Games">Games</a></li>
</ul>
</li>
<li class="li"></li>
<li><a href="#About">About</a></li>


لمشاهدة الموضوع : http://news-for-wou.blogspot.com/201...-css-html.html

Dark-Angel 06-12-2013 03:35 PM

رد: طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html
 
شكراااااا ^^


تحياتي :

:bloggerexp:

mestr.joker 06-21-2013 05:53 PM

رد: طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html
 
جميــــــــــــل

geekchiheb 06-28-2013 08:43 AM

رد: طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html
 
very goooooooooood

water man 06-28-2013 08:05 PM

رد: طريقة إضافة NavBar أنيق لمدونة بلوجر Css & Html
 
جيد :)

شكرا


الساعة الآن 12:06 PM

Powered by vBulletin® Copyright ©2000 - 2024 Dov By EGYNT.Co
new notification by 9adq_ala7sas
Developed By Marco Mamdouh
معهد خبراء بلوجر - 2012