|
إنضمامك إلي منتديات استراحات زايد يحقق لك معرفة كل ماهو جديد في عالم الانترنت ...
انضم الينا
#1
| ||
| ||
بسم الله الرحمن الرحيم اهلا بكل زوار المنتدى من جميع الدول العربية التحية الطيبة وبعد
__DEFINE_LIKE_SHARE__
بعض طلب الكثير والبحث والسؤال عن كيفية عمل صندوق اقتباس مميز للبلوجر تلقائيا اليوم اتيت لكم بمجموعة من الأكواد الجزاء الأول بتقنية css3 طريقة التركيب سهلة جدا نفتح القالب ثم تحرير html ثم نحرر القالب ملحوظة:اذا لم يظهر صندوق الأقتباس قم بعمل الأتى أبحث عن رمز Code: .post blockquote وأحذف الكود بأكملة قد تجدة بهذا الشكل رمز Code: .post blockquote{margin:1em 20px} .post blockquote p{margin:.75em 0} ثم قم بالأتى بالضفط على ctrl+f ونقوم بالبحث عن الكود التالى رمز Code: ]]> وتضيف قبله او فوقة اى شكل يعجبك من الاشكال الاتية الشكل الأول رمز Code: blockquote { border-bottom-left-radius: 6px; -webkit-bottom-left-radius: 6px; -moz-bottom-left-radius: 6px; -o-bottom-left-radius: 6px; border-bottom-right-radius: 6px; -webkit-border-bottom-right-radius: 6px; -moz-border-bottom-right-radius: 6px; -o-border-bottom-right-radius: 6px; margin: 0 0 20px; border-left: 30px solid #FC4F08; background-color: #302C2B; color: #B8B4AA; border-radius: 10px 20px 20px 10px; -webkit-border-radius: 10px 20px 20px 10px; -moz-border-radius: 10px 20px 20px 10px; -o-border-radius: 10px 20px 20px 10px; padding: 4% 2% 4% 3%; font-family: 'Voces', cursive; font-size: medium; text-align: left !important; direction: ltr !important; } q:before, q:after, blockquote:before, blockquote:after { content: ""; } Pseudo ::after element الشكل الثانى رمز Code: .post blockquote { max-height: 400px; clear: both; padding: 0 10px 10px 10px; border: 1px solid #DDD; color: #666; direction: ltr; text-align: left; border-radius: 4px; font: 12px "Courier New", "MS Sans Serif", sans-serif, serif; line-height: 1.6em; -ms-overflow-x: auto; overflow-x: auto; position: relative; z-index: 50; background: #FFF; } .post blockquote:before { content: " CODE --> copy/past this code and Enjoy --> "; padding: 0px 20px; margin: 0 -10px 5px -10px; border-bottom: 3px solid #A4D3DF; display: block; background: #E5F8FD url(https://jetara.googlecode.com/files/...9%8A%D9%84.png) left 2px top 2px no-repeat; color: #A4B1B8; } الشكل الثالث رمز Code: blockquote { width: 80%; color: #fff; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; background: #FFCC00; border: 2px solid #80D4DF; color: #333; position: relative; padding: 20px 30px; border: none; margin: 0 auto; margin-bottom: 15px; font-size: 13px; margin-right: -2px; } blockquote:before { background: #99CCFF; content: "إقتباس"; position: absolute; left: -31px; text-align: center; line-height: 32px; color: #FFF; top: 0; width: 50px; height: 28px; font-weight: bold; } الشكل الرابع رمز Code: .post blockquote { background: #EFEFEF; border: 2px dotted #000000; box-shadow: 1px 1px 0 #000, 3px 3px 0 #fff, 4px 4px 0 #000, 6px 6px 0 #fff, 7px 7px 0 #000, 9px 9px 0 #fff, 10px 10px 0 #000; color: #404141; direction: ltr; font: 14px Arial; margin: 15px auto; max-height: 400px; overflow: auto; padding: 15px; text-align: left !important; width: 80%; } .post blockquote:before { background: url("https://lh6.googleusercontent.com/-o21bsEOelAg/UxPihCR6zMI/AAAAAAAADfA/DxMGdc0seoo/s172/16x16.png") no-repeat scroll 99% -97px #000000; color: #FFFFFF; content: "3alam-b.Blogspot.Com كود معد بواسطة"; display: block; font: bold 12px droid arabic kufi; height: 20px; margin: -15px -15px 5px; padding: 4px 30px 6px 0; text-align: right !important; } الشكل الخامس رمز Code: post blockquote { margin: 15px 35px 15px 15px; padding: 10px; clear: both; list-style-type: none; background: #FFFBC6 url(http://4.bp.blogspot.com/-Gzg8P-_mMI.../s320/cv-1.png) no-repeat right bottom; border-top: 1px solid #4977FF; border-right: 1px solid #5686FF; border-bottom: 1px solid #475FFF; border-left: 1px solid #5686FF; border-radius: 10px; box-shadow: 2px 3px 3px 1px rgba(0, 0, 0, 0.5), 0 2px 2px 0 rgba(255, 255, 255, 0.5) inset; height: 380px; overflow: scroll; overflow-x: hidden; direction: ltr; } مع تحيات مدونة نصائح للمدونين شاهد ايضا أفضل خمس طرق للربح من الإنترنت اجبار الزائر على مشاهد الفديو بمدونتك أسباب فشل بعض المدونات يمكنك تقديم الشكر عن طريق الأنضمام لنا |
مواقع النشر (المفضلة) |
| |
المواضيع المتشابهه | ||||
الموضوع | كاتب الموضوع | المنتدى | مشاركات | آخر مشاركة |
مجموعة اكواد صناديق بلوجر الجزء الأول بتقنية css3 | محروم.كوم | منتدى أخبار المواقع والمنتديات العربية والأجنبية | 0 | 05-13-2014 08:10 PM |
ضافة اداة "لأفضل تصفح للمدونة " بتقنية الـ css3 لمدونات بلوجر | محروم.كوم | منتدى أخبار المواقع والمنتديات العربية والأجنبية | 0 | 02-20-2014 09:20 PM |
افضل سكربت موقع اجتماعي مع مميزات عديدة بتقنية css3 | محروم.كوم | منتدى أخبار المواقع والمنتديات العربية والأجنبية | 0 | 09-08-2013 11:20 PM |
ورشة تصميم وتكويد هيدر بتقنية css3+html5 | محروم.كوم | منتدى أخبار المواقع والمنتديات العربية والأجنبية | 0 | 11-04-2011 05:30 PM |
:: استايل العيد منعش بتقنية css3 من شبكة باقة للجميع ~ | محروم.كوم | منتدى أخبار المواقع والمنتديات العربية والأجنبية | 0 | 08-30-2011 03:10 PM |