كيف يمكن وضع الصور في الكود التالي تلقائياً عند وضع وسم blockquote عن طريق css ؟
كود HTML:<blockquote dir="rtl"><img src="quote1.gif" alt="" align="right" />نص مقتبس ..<img src="quote2.gif" alt="" /> </blockquote>
كيف يمكن وضع الصور في الكود التالي تلقائياً عند وضع وسم blockquote عن طريق css ؟
كود HTML:<blockquote dir="rtl"><img src="quote1.gif" alt="" align="right" />نص مقتبس ..<img src="quote2.gif" alt="" /> </blockquote>
التعديل الأخير تم بواسطة dev11 ; 10-07-2008 الساعة 06:51 PM
جرب التالي :
كود css
كود:.quote{ margin:15px 10px; background: url('quote1.gif') top right no-repeat; padding-right:25px; } blockquote.bq{ direction: rtl; border-right:3px solid #ccc; margin:0px; padding:0px 5px; }
كود html
كود:<div class="quote"> <blockquote class="bq">نص مقتبس .. <img src="quote2.gif" alt="" /> <div>الاقتباس ضعه هنا</div> </blockquote> </div>
حسناً .. ما أريده هو أن يتم وضع الصور عن طريق الـ css أي أنني لا أريد إضافتها يدوياً .. ، وأيضاً بدون زيادة وسوم أخرى أي .. وسم الـ blockquote فقط
هذا الكود سوف يقوم بجعل اي اقتباس بهذه المواصفاتblockquote{
margin:15px 10px;
background: url('quote1.gif') top right no-repeat;
padding-right:25px;
}
ماذا عن الصورة الثانية ؟
اذا كنت تريد التاثير باستخدام فقط blockquoteحسناً .. ما أريده هو أن يتم وضع الصور عن طريق الـ css أي أنني لا أريد إضافتها يدوياً .. ، وأيضاً بدون زيادة وسوم أخرى أي .. وسم الـ blockquote فقط
لابد من استخدام الجافاسكربت لان ادخال صورتين على عنصر غير ممكن بل لابد ان يكونو عنصرين داخل بعض..
الكود عبارة عن اضافة لكود الاخ محمد والاخ صادق
الفكرة في استبدال كل blockquote وادخال فيه عنصر جديد..
او بدون جافا سكربت (وهذا ما افضله)كود HTML:<style type="text/css"> blockquote { background: url(quote1.gif) top right no-repeat; padding-right:25px; } blockquote div.innerQuote { background: url(quote2.gif) top left no-repeat; padding-left:25px; } </style> <script type="text/javascript"> // <!-- window.onload = myOnLoad; function myOnLoad() { var blockQuotes = document.getElementsByTagName("blockquote"); for(var i = 0; i < blockQuotes.length; i++) { blockQuotes[i].innerHTML = '<div class="innerQuote">' + blockQuotes[i].innerHTML + '</div>'; } } // --> </script> <blockquote>TEXT</blockquote> <blockquote>TEXT2</blockquote>
<blockquote><div class="innerQuote">TEXT</div></blockquote>
رائع أستاذي flasher .. فعلاً الـ javascript يمكنها القيام بهذه العملية .. لا أعلم لماذا لم أفكر بذلك مسبقاً .. لكن مع ذلك سألتزم بإستخدام الـ css فقط ، شكراً لك