كود الملاحظات باكثر من شكل و بتقنية css3 .
صفحة 1 من اصل 1 • شاطر
كود الملاحظات باكثر من شكل و بتقنية css3 .
نقدم لكم كود الملاحظات الشهير بشكل مميز
يستعمل باشكال عدة وفي جميع اقسام المنتدى
الكود لجميع منتديات احلى منتدى
يستعمل باشكال عدة وفي جميع اقسام المنتدى
الكود لجميع منتديات احلى منتدى
صورة عن الكود
مثال لصناديق محدبة الزوايا (خصائص css3)
![كود الملاحظات باكثر من شكل و بتقنية css3 . 145804026540231](https://2img.net/h/store1.up-00.com/2016-03/145804026540231.png)
كود css
- الكود:
/*MESSAGE BOX WITH ICONS*/
.msg-box, .ok-box, .success-box, .warning-box, .error-box{
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.msg-box{
border:solid 1px #8e8e04;
background:#FFFFCC url(images/msg.png) 97% 6px no-repeat;
color:#222222;
padding:6px;
text-align:center;
}
.ok-box{
border:solid 1px #27739d;
background:#94d5fb url(images/ok.png) 97% 6px no-repeat;
color:#222222;
padding:6px;
text-align:center;
}
.success-box{
border:solid 1px #90ac13;
background:#eef4d3 url(images/success.png) 97% 6px no-repeat;
color:#222222;
padding:6px;
text-align:center;
}
.warning-box{
border:solid 1px #ba4c0e;
background:#ffcaa4 url(images/warning.png) 97% 6px no-repeat;
color:#222222;
padding:6px;
text-align:center;
}
.error-box{
border:solid 1px #dc2727;
background:#f2abab url(images/error.png) 97% 6px no-repeat;
color:#222222;
padding:6px;
text-align:center;
}
/*MESSAGE CSS BOX*/
.yellow-box{
border:solid 1px #8e8e04;
background:#FFFFCC;
color:#222222;
padding:6px;
text-align:center;
}
.blue-box{
border:solid 1px #27739d;
background:#94d5fb;
color:#222222;
padding:6px;
text-align:center;
}
.green-box{
border:solid 1px #90ac13;
background:#eef4d3;
color:#222222;
padding:6px;
text-align:center;
}
.orange-box{
border:solid 1px #ba4c0e;
background:#ffcaa4;
color:#222222;
padding:6px;
text-align:center;
}
.red-box{
border:solid 1px #dc2727;
background:#f2abab;
color:#222222;
padding:6px;
text-align:center;
}
بعد اضافة كود ال css لاستعمال الكود على المنتدى يجب عليك اضافة ملاحظاتك مستعملا الكود التالي
- الكود:
[table class=warning-box][tr][td]أكتب هنا ما تريد[/td][/tr][/table]
طبعا ok-box تميز الصندوق الأزرق ذو الأيقونة، إن أردت استعمال صندوق آخر
ما عليك سوى استبدالها بأخرى مميزة للصندوق المطلوب. مثلا صندوق الخطأ
الأحمر تميزه error-box و صندوق التحذير البرتقالي تميزه warning-box ...
رد: كود الملاحظات باكثر من شكل و بتقنية css3 .
الله يعطيكـِ العافيه يارب |
فتحى الملاح- احلى ادارةعضو قمرالكوامل منذ 10 سنوات
- عضو متميز
- الجنس :
عدد المساهمات : 64
الابراج :
صفحة 1 من اصل 1
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى