[Css] .. ظ‚ط§ط¦ظ…ط© ط§ظ„طھط¨ط§ط¯ظ„ط§طھ ط§ظ„ظ†طµظٹط© ط¨طھظ‚ظ†ظٹط© Css ط§ظ„ط*ط¯ظٹط«ط© .. ظپظƒط±ط© ط¬ط¯ظٹط¯ط© .. ط*طµط±ظٹط© ..~


السلام عليكم ورحمة الله تعالى وبركاته ..~

أقدم لكم اليوم فكرة حصرية جديدة ..~

وهي بعنوان : [Css] .. قائمة التبادلات النصية بتقنية Css الحديثة .. فكرة جديدة .. حصرية ..~

..~ لمشاهدة الفكرة ~..
http://www.swalifcam.com/e3lanat-nceh.html

..~ والأن مع طريقة تركيب install القائمة ~ ..

أولاً نتوجه للوحة التحكم ---> التحكم بالإستايل styleات --> نختار الإستايل style المراد التعديل عليه --> من ثم رئيسي Css --> ومن ثم نبحث عن تعاريف CSS الإضافية/Additional CSS Definitions --> نضع الكود code الأتي في المربع الثاني:
رمز PHP:
<code style="white-space:nowrap"> <code> #navlist {
margin: 0px auto 0px auto;
padding: 0px;
list-style-type: none;
float: right;
display: block;
}
#navlist li{
float:right;
}
#navlist a {
border: 3px solid #990000;
font-family: TAhoma;
font-size: 9pt;
text-decoration: none;
color: #990000;
display: block;
width: 150px;
height: 30px;
text-align: center;
line-height: 32px;
padding-right: 0px;
margin-right: 0px;
}
#navlist .hed {
background-color: #999966;
border: 1px dashed #999966;
font-family: tahoma;
font-size: 12pt;
color: #336600;
padding-right: 5px;
margin-right: 5px;
margin-left:auto;
margin-right:auto;


}
#navlist .hed:hover{
background-color:#ccc;
font-size:12pt;
border-bottom-width:2px;
margin-left:auto;
margin-right:auto;


}
#navlist a:hover {
border: 2px solid #FF9933;
font-family: TAhoma;
font-size: 10pt;
text-decoration: none;
color: #990000;
display: block;
width: 150px;
height: 30px;
text-align: center;
line-height: 32px;
background-color: #999966;



margin-left:auto;
margin-right:auto;

}
</code> </code>

طبعاً تركيب install القائمة راح يكون في الفوتر ..
نتوجه إلى التالي :
البحث في القوالب --> نختار الإستايل style المراد وضع القائمة فيه --> ونبحث عن قالب template الـ -->footer
ونلصق الكود code التالي في أخر القالب template تحت كلمة </script> التي توجد في أخر القالب template ..
رمز PHP:
<code style="white-space:nowrap"> <code> <ul id="navlist">
<li><a class="hed">التبادلات النصية</a></li>
<li><a href="#">الإتصال بنا</a></li>
<li><a href="#">التسجيل</a></li>
<li><a href="#">أعلن معنا</a></li>
<li><a href="#">الدردشة الصوتية</a></li>
</ul>
<ul id="navlist">
<li><a class="hed">التبادلات النصية</a></li>
<li><a href="#">الإتصال بنا</a></li>
<li><a href="#">التسجيل</a></li>
<li><a href="#">أعلن معنا</a></li>
<li><a href="#">الدردشة الصوتية</a></li>
</ul>

<ul id="navlist">
<li><a class="hed">التبادلات النصية</a></li>
<li><a href="#">الإتصال بنا</a></li>
<li><a href="#">التسجيل</a></li>
<li><a href="#">أعلن معنا</a></li>
<li><a href="#">الدردشة الصوتية</a></li>
</ul>
<ul id="navlist">
<li><a class="hed">التبادلات النصية</a></li>
<li><a href="#">الإتصال بنا</a></li>
<li><a href="#">التسجيل</a></li>
<li><a href="#">أعلن معنا</a></li>
<li><a href="#">الدردشة الصوتية</a></li>
</ul>
<ul id="navlist">
<li><a class="hed">التبادلات النصية</a></li>
<li><a href="#">الإتصال بنا</a></li>
<li><a href="#">التسجيل</a></li>
<li><a href="#">أعلن معنا</a></li>
<li><a href="#">الدردشة الصوتية</a></li>
</ul>
</code> </code>

ملاحظات :
لعملية تغير الرابط نستبدل:
رمز PHP:
<code style="white-space:nowrap"> <code> #
</code> </code>

بـ الرابط الذي تريده لكي يصبح:
http://www.xxx.com

xxx هو رابط موقعك أو المعلن لديك ..



ملاحظة : حاولت إني أسوي لها توسيط لكن عجزت فـ لو أحد يقدر يوسطها بالنص يوسطها ..~


مصدر الموضوع : http://forum.swalifcam.com/showthread.php?t=546

دمتم بخير ..~




التعديل الأخير كان بواسطة swalifcam; 31 - 08 - 2014 الساعة 04:37




©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©