السلام عليكم ورحمة الله
اهلاً بكم زوار ومتابعي المدونة الكرام ، اليوم في درسنا هذا
سوف نتعرف كيفية إضافة ملاحظة أو تنويه على شكل بيضوي من ثم فقاعات صغيرة
إلى مشاركتك وهذه الإضافة جذابة وتضيف إلى مدونتك لمسة إحترافية .
1- ادخل إلى مدونتك ثم اختر لوحة التحكم .
2- من لوحة التحكم اختر قالب >>> ثم تحرير قالب .
3- ابحث عن الوسم : ]]></b:skin>
4- اضف الكود التالي فوقه .
كود:
p.bestavdhoot {
position:relative;
width:400px;
padding:20px 40px;
margin:10px 10px 80px 40px;
background:#f7a944;
background:-webkit-gradient(linear, 0 0, 0 100%, from(#fac868), to(#f3961c));
background:-moz-linear-gradient(#fac868, #f3961c);
background:-o-linear-gradient(#fac868, #f3961c);
background:linear-gradient(#fac868, #f3961c);
-webkit-border-radius:180px;
-moz-border-radius:180px;
border-radius:180px;
-webkit-box-shadow: -3px 4px 8px #989898;
-moz-box-shadow: -3px 4px 8px #989898;
box-shadow: -3px 4px 8px #989898;
color:#575544;
font-size:1em;
letter-spacing:.06em;
}
p.bestavdhoot:before {
content:"";
position:absolute;
bottom:-40px;
left:20px;
background:#f3961c;
width:30px;
height:30px;
-webkit-border-radius:30px;
-moz-border-radius:30px;
border-radius:30px;
/*add a drop shadow*/
-webkit-box-shadow: -3px 3px 4px #989898;
-moz-box-shadow: -3px 3px 4px #989898;
box-shadow: -3px 3px 8px #989898;
}
p.bestavdhoot:after {
content:"";
position:absolute;
bottom:-55px;
left:0;
width:15px;
height:15px;
background:#f3961c;
-webkit-border-radius:15px;
-moz-border-radius:15px;
border-radius:15px;
-webkit-box-shadow: -3px 3px 4px #989898;
-moz-box-shadow: -3px 3px 4px #989898;
box-shadow: -3px 3px 8px #989898;
}
- كيفية إضافة الملاحظة إلى مشاركتك :
- استخدم هذا الكود في وضعية HTML
كود:
<p class="bestavdhoot">
هنا ضع ملاحظتك
</p>
0 التعليقات :
إرسال تعليق