تنسيق شكل سحابة التسميات فى مدونتك




اليوم وفى موضوع جديد من مدونه تقنيات الانترنت أقدم لكم شرع تنسيق شكل التسميات فى مدونات بلوجر بشكل احترافى للغاية ، لأن أداة التسميات فى بلوجر ومعظم القوالب تكون تقليدية بعض الشيء فلذلك قررت عرض هذا الموضوع لمتتبعى مدونة تقنيات الانترنت الكرام ولكى لا أطيل عليكم هيا بنا للمعاينة وشرح تنسيق التسميات 

شرح تنسيق شكل سحابة التسميات
اذهب للوحة التحكم >> القالب >> تحرير HTML
ملحوظة
لابد أن تكون أداة التسميات مضافة بالفعل ومضبوطة بهذا الشكل

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

ضع قبله مباشرة كود الـ CSS التالى 
.label-size{ 
margin:0; 
padding:0; 
position:relative; 
.label-size a{ 
float:right
height:24px; 
line-height:24px; 
position:relative; 
font-size:12px
margin-bottom: 9px; 
margin-left:20px; 
padding:0 10px 0 12px; 
background:#0089e0; 
color:#fff; 
text-decoration:none; 
-moz-border-radius-bottomright:4px; 
-webkit-border-bottom-right-radius:4px; 
border-bottom-right-radius:4px; 
-moz-border-radius-topright:4px; 
-webkit-border-top-right-radius:4px; 
border-top-right-radius:4px; 
.label-size a:before{ 
content:""; 
float:right
position:absolute; 
top:0; 
left:-12px; 
width:0; 
height:0; 
border-color:transparent #0089e0 transparent transparent; 
border-style:solid; 
border-width:12px 12px 12px 0;  
.label-size a:after{ 
content:""; 
position:absolute; 
top:10px; 
left:0; 
float:left; 
width:4px; 
height:4px; 
-moz-border-radius:2px; 
-webkit-border-radius:2px; 
border-radius:2px; 
background:#fff; 
-moz-box-shadow:-1px -1px 2px #004977; 
-webkit-box-shadow:-1px -1px 2px #004977; 
box-shadow:-1px -1px 2px #004977; 
}  
.label-size a:hover{background:#555;} 
.label-size a:hover:before{border-color:transparent #555 
transparent transparent;}
√ غير الأجزاء المحدده فى الكود السابق بما يناسب زوقك     
√ أتمنى كلمة شكر على المجهود المبذول فلا تكن أبخل الناس بها

ليست هناك تعليقات:

إرسال تعليق

تقنيات الانترنت تصميم محمد بقلوله جميع الحقوق محفوظة 2014

صور المظاهر بواسطة sndr. يتم التشغيل بواسطة Blogger.