شرح زر الإقتباس لتحديد نص معين أو كود في صندوق مخصص ~ خــــــــــــــــــــــــبر عاجــــــــــــــــــــــــــــل

شرح رز الإقتباس لتمييز النصوص و الأكواد

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

زر الأقتباس

هو الشكل الذي يكون بداخله كود أو جملة قابلة للنسخ وخصوصاً الأكواد واليوم إن شاء الله سوف نطرح العديد من هذه الصناديق وطريقة تركيبها وتخصيصها ايضاً على حسب شكل مدونتك ...

أمثلة على صناديق الإقتباس

الكود

.post blockquote {overflow:auto;max-height:250px;background:#F8E2D2;color:#000;border-left:20px solid #e33a20;border-radius:20px;margin:10px;padding:10px;}

الصندوق الثاني

الكود

.post blockquote {margin : 0 20px;padding: 10px 20px 25px 20px;background : #000000;color : #FFFFFF;border: 5px dashed #fff;}

الصندوق الثالث

الكود

.post blockquote {position: relative;z-index: 50;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2z1aoPXzCg1oZ1j5rxD7XEf0iAqza8ybJHciS5lXr-6ZgoKiMIqzLkp7nVYzXYYPCw6wJBwt5bodpIjkuJHZoFWe5GiofM_r-neufLtBkehnN58WGC_6x9juWYPqwwBl9L18uC9mTs-A/h120/bq3.gif) top left repeat;border:1px solid #999;color:#000;display:block;font-family:'Droid Sans',DroidKufi-regular,DroidKufi-regular,sans-serif;font-size:13px;line-height:18px;margin:10px 0 10px;padding:18px 10px 17px;overflow:auto;max-height:250px;}

الصندوق الرابع

الكود

.post blockquote {overflow:auto;max-height:250px;border: 1px dashed #51F84E;margin: 10px;padding: 10px 10px 10px 60px;background: #D2FDD1 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifaLo4C8mpUT5oTNuNeUUI77zXRTfEEk26h-gdNbWmHxpItznnAbwGXAnnzjUuYo6sq_ZRkAfxTUzVfPSRNXQX7P-GMl5CakI9-FxgKeJuhZrh0_nyczzsBLocl7vQ9c-5oqHWcOeeeaY/h120/30-07-2013+12-52-35+%D9%85.png) no-repeat;background-position:20px 10px;}

الصندوق الخامس

الكود

.post blockquote {background: #E4F6F8;margin: 0 25px 15px;padding: 10px 20px 10px 15px;border: dotted 2px #51C4D5;overflow:auto;max-height:250px;-webkit-box-shadow:1px 1px 0 rgba(0, 0, 0, 0.100),3px 3px 0 rgba(255, 255, 255, 1.0),4px 4px 0 rgba(0, 0, 0, 0.125),6px 6px 0 rgba(255, 255, 255, 1.0),7px 7px 0 rgba(0, 0, 0, 0.150),9px 9px 0 rgba(255, 255, 255, 1.0),10px 10px 0 rgba(0, 0, 0, 0.175);-moz-box-shadow:1px 1px 0 rgba(0, 0, 0, 0.100),3px 3px 0 rgba(255, 255, 255, 1.0),4px 4px 0 rgba(0, 0, 0, 0.125),6px 6px 0 rgba(255, 255, 255, 1.0),7px 7px 0 rgba(0, 0, 0, 0.150),9px 9px 0 rgba(255, 255, 255, 1.0),10px 10px 0 rgba(0, 0, 0, 0.175);box-shadow:1px 1px 0 rgba(0, 0, 0, 0.100),3px 3px 0 rgba(255, 255, 255, 1.0),4px 4px 0 rgba(0, 0, 0, 0.125),6px 6px 0 rgba(255, 255, 255, 1.0),7px 7px 0 rgba(0, 0, 0, 0.150),9px 9px 0 rgba(255, 255, 255, 1.0),10px 10px 0 rgba(0, 0, 0, 0.175);}