تغير شكل صندوق الاقتباس v1
اهلا بكم احبائى الكرام فى تدوينة جديدة على مدونة كن مهووس. موضوعنا هو عن كيفية تغير شكل صندوق الاقتباس الافتراضى بشكل جميل ومنظم وكمثال على صندوق الاقتباس فهذة هى معاينة للصندوق
مثال لتوضيح شكل صندوق الاقتباس مثال لتوضيح شكل صندوق الاقتباس مثال لتوضيح شكل صندوق الاقتباس مثال لتوضيح شكل صندوق الاقتباس مثال لتوضيح شكل صندوق الاقتباس مثال لتوضيح شكل صندوق الاقتباس
الشرح
بالتفصيل
1- نتوجه الى القالب => تحرير html => نبحث عن الوسم </body> اضف قبله هذا الكود
<b:if cond='data:blog.pageType == "item"'>
<style>
.tr_bq{overflow: scroll;max-height: 300px;background:#3c5588;position:relative;padding:55px 20px 20px 20px;color:#fff;margin:10px 0;border-radius:3px;font-size: 13px;direction: ltr;}
.tr_bq:before{text-align: center;position:absolute;content:'مثال او توضيح';background:rgba(255,255,255,1);left:3px;right:3px;top:3px;padding:5px 20px;display:block;font-weight:700;border-radius:3px 3px 0 0;color:#6591c2}
<style>
<script type='text/javascript'>
//<![CDATA[
// Selection
for(var pres=document.querySelectorAll("pre,kbd,blockquote,td"),i=0;i<pres.length;i++)pres[i].addEventListener("dblclick",function(){var e=getSelection(),t=document.createRange();t.selectNodeContents(this),e.removeAllRanges(),e.addRange(t)},!1);
//]]>
</script>
</b:if>
2- احفظ القالب
3- ادخل للتدوينة وقم بتحديد النص او الصور المراد وضعها فى صندوق الاقتباس ثم اضغط على العلامة الموضحة بالصورة
تعليقات