المساعد الشخصي الرقمي

مشاهدة النسخة كاملة : الوسم <fieldset> وتوحيد طريقة العرض على جميع المتصفحات !


fastgroup
06-21-2007, 09:31 AM
بسم الله الرحمن الرحيم ..

ربما العنوان مبهم لدى الكثيرين ـ ولكن شاهدوا هذه الصورة من داخل متصفح Internet Explorer ..

http://www.dev4arab.org/ca2oom/pic/fieldset001.gif

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

ولكن تعال معي شاهد نفس الصورة كيف تبدو من داخل متصفح FireFox ومتصفح Opera


http://www.dev4arab.org/ca2oom/pic/fieldset002.gif

تحول الشكل الجميل والحواف الدائرية الى حواف حادة واصبح شكله كأنه محفور بطريقه غير جيدة..

طيب معلش هاتعبك معي ـ ولكن ارجع مرة أخرى على متصفح Internet Explorer ولكن هذه المرة تصفح الموقع وانت على Classic style

وطريقة تفعيله من الويندوز كالتالي :

كليك يمين على اى مكان فارغ بسطح المكتب Desktop ثم إختر خصائص او Propertise ومن النافذة التى ستفتح اختر منها المظهر او Appearance ـ ثم من أول حقل أختر النمط Windows Classic style وبعدين Ok

احب جدا هذا الإستايل التقليدي السريع في ويندوز http://www.traidnt.net/vb/images/smilies/cupidarrow.gif

لو شاهدت الان نفس الإطار وانت على متصفح Internet Explorer ستجده تحول ليصبح مثل الإطار الموجود في متصفحات Opera و FireFox ! والتأثير الجميل والحواف الدائرية التى كنت تشاهدتها سابقاً لن تظهر في كل الأحوال ..


ما سنفعله الان حتى يظهر الإطار بشكل واحد على كافة المتصفحات بدل الإطار المحفور الذى يجعل شكل الإستايل مش ولا بد ـ أننا سنقوم بتلوين ذلك الإطار الى اى لون مناسب للون الإستايل مع التنازل عن الحواف الدائرية ..

ضع هذا الكود في تعاريف css إضافية بلوحة التحكم ..


fieldset{border:1px solid #D0D0BF;padding:8px;}
غير اللون الى مايناسب منتداك ـ والنتيجة على جميع المتصفحات ومع إختلاف إستايل الويندوز واحده كالتالي ...


http://www.dev4arab.org/ca2oom/pic/fieldset003.gif

ولمستخدمي متصفح FireFox بالخصوص هناك أمر في css تتمكن به من تمكين الحواف الدائرية لتظهر عليه فقط ..

إستبدل الكود السابق بالتالي :


fieldset{border:1px solid #D0D0BF;padding:8px;-moz-border-radius:5px}
ولمن لا يعرف طريقه تطبيقها على أسماء المنتديات او التواقيع ـ يستخدم هذا الكود

<fieldset class="fieldset">
<legend>عنوان</legend>
المحتوى
</fieldset>

## إنتهي ##
وتقبلوا جميعاً التحيه ،،

المصدر ترايدنت

نادى كل العرب
11-03-2007, 11:55 AM
مشكور
مشكورمشكور
مشكورمشكورمشكور
مشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكور
مشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكورمشكور مشكور