وفيما يلي المحتوى المقتبس: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <الرأس> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>ارتفاع متساوي (طريقة الحصول على نفس ارتفاع العمود)</title> <نمط النوع = "نص/CSS"> جسم{ الحشو: 0؛ الهامش: 0; حجم الخط: 12 بكسل؛ عائلة الخطوط: Arial، Helvetica، sans-serif؛ ارتفاع الخط: 140%؛ الخلفية:#E7DFD3; } #وسط{ العرض: 580 بكسل؛ تعويم: يسار؛ الخلفية:#FFFFFF؛ محاذاة النص:يسار؛ } #الرأس، #التذييل{ الخلفية: #E8E8E8؛ العرض: 750 بكسل؛ محاذاة النص:مركز؛ } #جانبي{ العرض: 580 بكسل؛ تعويم: يسار؛ الموقف:نسبي؛ الهامش الأيسر:-580 بكسل؛ } #جانبي{ العرض: 170 بكسل؛ تعويم: حق؛ الموقف:نسبي؛ الهامش: 0 -170 بكسل 0 0; الخلفية: #F0F0F0؛ } #تذييل{ واضح:كلاهما؛
} ح1، ح2، العنوان، ص { الهامش: 0; الحشو: .8em؛ } h1، h2 {حجم الخط: 20 بكسل؛} </نمط> <نوع البرنامج النصي = "نص/جافا سكريبت"> // <![CDATA[ وظيفة تبديل المحتوى (الاسم، ن) { var i,t='',el = document.getElementById(name); if (!el.origCont) el.origCont = el.innerHTML;
for (i=0;i<n;i++) t += el.origCont; el.innerHTML = t; } // ]]> </script> </الرأس> <الجسم> <div معرف = "رأس"> <h1>الرأس</h1> <div معرف = "وسط"> <div معرف = "sideright"> <div معرف = "sideleft"> <h2>الجانب الأيسر</h2> <p><a href="javascript:toggleContent('sideleft',1)">الطول الافتراضي</a> <a href="javascript:toggleContent('sideleft',2)">صفحة أطول< /أ></ص> <p> ليس من السهل الانتقال من أسلوب التصميم الثابت القائم على البكسل إلى أسلوب التصميم المرن والنسبي. ولكن إذا تم استخدامه بشكل صحيح، فقد يكون خيارًا طبيعيًا لزيادة إمكانية الوصول وسهولة الاستخدام دون التضحية بالتصميم. </ص> <p> البكسل هو نقطة غير قابلة للتحجيم على شاشة الكمبيوتر، و h3 هو مربع بحجم الكلمة. بسبب التغيير في حجم الخط، h3 وحدة نسبية تمثل حجم النص المفضل للمستخدم. </ص> <p> قد يكون من الأسهل اختيار تصميم مطبوع وثابت لأنه لن يكون هناك ما يجب مراعاته إذا ظلت الأبعاد كما هي. ومع ذلك، إذا اعتمدت طريقة تصميم مرنة، فيمكنك الاستفادة الكاملة من شاشة الكمبيوتر <a href="http://product.yesky.com/catalog/345/" class="bluekey" target="_blank"> </a> والمتصفح. </ص> <p> ربما تريد أن يظهر موقع الويب الخاص بك بطريقة معينة، ولكن ما يريد المستخدمون رؤيته قد يكون مختلفًا. أي شيء يتم فرضه على المستخدمين يقوض سهولة الاستخدام وبالتالي يضر بنجاح الموقع. </ص> <p> ليس من السهل الانتقال من أسلوب التصميم الثابت القائم على البكسل إلى أسلوب التصميم المرن والنسبي. ولكن إذا تم استخدامه بشكل صحيح، فقد يكون خيارًا طبيعيًا لزيادة إمكانية الوصول وسهولة الاستخدام دون التضحية بالتصميم. </ص> </div>
<h2>جانب اليمين</h2> <p> ليس من السهل الانتقال من أسلوب التصميم الثابت القائم على البكسل إلى أسلوب التصميم المرن والنسبي. ولكن إذا تم استخدامه بشكل صحيح، فقد يكون خيارًا طبيعيًا لزيادة إمكانية الوصول وسهولة الاستخدام دون التضحية بالتصميم. </ص> <p> البكسل هو نقطة غير قابلة للتحجيم على شاشة الكمبيوتر، و h3 هو مربع بحجم الكلمة. بسبب التغيير في حجم الخط، h3 وحدة نسبية تمثل حجم النص المفضل للمستخدم. </ص> <p> قد يكون من الأسهل اختيار تصميم مطبوع وثابت لأنه لن يكون هناك ما يجب مراعاته إذا ظلت الأبعاد كما هي. ومع ذلك، إذا كنت تعتمد أسلوب تصميم مرن، فيمكنك الاستفادة الكاملة من شاشة الكمبيوتر والمتصفح. </ص> <p> ربما تريد أن يظهر موقع الويب الخاص بك بطريقة معينة، ولكن ما يريد المستخدمون رؤيته قد يكون مختلفًا. أي شيء يتم فرضه على المستخدمين يقوض سهولة الاستخدام وبالتالي يضر بنجاح الموقع. </ص> </div></div> <div معرف = "تذييل"> <العنوان> تذييل </العنوان> <p>الإنتاج: <a href="http://homepage.yesky.com">شريط تاو لصفحة الويب</a></p> </div> </الجسم> </html> <لغة سكريبت = "جافا سكريبت"> var now = new Date(); document.write("<img src='http://counter.yesky.com/counter.shtml?CID=54197&AID=-1&refer="+escape(document.referrer)+"&rand="+ now.getTime() + "&cur="+escape(document.URL)+"' border='0' alt='' width='0' height='0'>"); </script> <noscript> <img src="http://counter.yesky.com/counter.shtml?CID=54197&AID=-1&refer=noscriptcounter&cur=noscriptcounter" border='0' width='0' height='0'/> </noscript> |