ملخص لتجربة تطوير المتصفح (I) علامات HTML

نظرًا لأن المتصفحات المختلفة لها تفسيرات مختلفة للعلامات وأوراق الأناقة ، فمن الضروري تحديد نوع مستند قياسي لملف HTML ، بحيث يمكن للمتصفحات المختلفة تحليل الصفحات وتقديمها وفقًا لمعيار HTML موحد.

! Doctype يعلن DTD أن المستند المحدد يتوافق معه ، مثل:

<! doctype html public -// w3c // dtd html 4.0 transitional // en http://www.w3.org/tr/html4/loose.dtd>

<! doctype html public -// w3c // dtd xhtml 1.0 transitional // en http://www.w3

يمكن أن يؤدي استخدام الجداول للتخطيط بسهولة إلى تكرار الكود ، ومقارنته بكتابة <div> </viv> ، هناك العديد من الرموز. علاوة على ذلك ، يحتاج الجدول إلى تنزيل جميع العناصر وعرضها ، كما أن صفحة الويب المقابلة بطيئة أيضًا.

يجب استخدام بنية صفحة موحدة: Div+CSS. طريقة التخطيط هذه بسيطة في التعليمات البرمجية ، وسرعة تصفح الصفحات السريعة ، وتخطيط الصفحة المرنة. عند المراجعة ، تحتاج فقط إلى تغيير نمط CSS لتحقيق ترحيل الصفحة دون تغيير البرنامج ، وبالتالي تقليل تكلفة مراجعة موقع الويب.

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

<div class = Outer>

<name form = testform>

<div class = inner>

<اسم الإدخال = نوع العنوان = text />

</form>

</div>

</div>

حتى إذا لم يعرض الجدول عنصر tbody المحدد ، فسوف يعتقد المتصفح أن العقدة الأصل لعقدة TR هي عقدة tbody الافتراضية تلقائيًا. من أجل تجنب سوء الفهم المحتمل عند معالجة عقدة TR باستخدام JavaScript ، من الأفضل إضافة واحدة يدويًا ، مثل:

<جدول معرف = mytable>

<tbody id = mytablebody>

<tr>

<td>

</td>

</r>

</tbody>

</table>

في بعض الأحيان ، تستجيب بعض الأحداث المرتبطة بالعناصر في متصفح IE ، ولكن ليس في Safari أو المتصفحات الأخرى. في هذا الوقت ، تحتاج إلى التحقق من صحة طريقة ربط الحدث. يجب أن يكون ربط الأحداث المتقدمة مختلفة عن IE والمتصفحات الأخرى لكتابة مجموعتين من JavaScripts ، في حين يحتاج نموذج الحدث البسيط إلى الانتباه إلى حالة اسم الحدث الربط. يحب:

<نوع الإدخال = اسم النص = keywordsearch onfocus = clearvalue ()>

يجب استخدام onfocus الصغيرة هنا ، وطريقة الكتابة القياسية هي رمز إغلاق العلامة المضافة المعروض.

<type type = text name = keywordsearch onfocus = clearvalue () />

خصائص اللغة والنوع من علامة <script>

يتم استخدام سمة اللغة لعلامة <script> لتحديد إصدار لغة البرنامج النصي. يجب أن تكون المهمة الصحيحة مثل <script> لإخبار المتصفح (بشكل رئيسي IE) لاستخدام بناء جملة JavaScript من الإصدار 1.2 لشرح ؛ يتم استخدام سمة النوع لتحديد نوع البرنامج النصي ، وهي سمة قياسية لـ W3C ، واستخدام السمات الصغيرة هو ممارسة قياسية تمشيا مع المعايير. إذا لم تكن بحاجة إلى إخبار المتصفح بشرحه في الإصدار السفلي من لغة JavaScript (إصدار JavaScript الحالي المدعوم من معظم المتصفحات هو 1.5) ، فأنت لا تحتاج عمومًا إلى تحديد سمة اللغة ، ولكن يجب تحديد سمة النوع. لذلك يجب أن يكون الرمز

على الرغم من أن قيم السمتين يتم عرض alt و title في شكل طرف أداة عند التحول على الماوس في IE ، لا يزال هناك فرق بين الاثنين. ALT هي الشاشة البديلة عند عدم عرض الصورة ، والعنوان هو الموجه عند وضع الماوس عليه.

في الإصدارات السابقة من HTML ، لم يكن من الضروري أن يتم تعيين جميع السمات. عند تمثيل خانة الاختيار ، يتم التعرف على طريقة الكتابة <الإدخال>. ومع ذلك ، وفقًا لمعيار XHTML ، فإن هذه القواعد ليست تنسيق XML صارم. انتبه إلى تعيين السمات وإغلاق العلامات لتتوافق مع اتجاه تطوير معايير HTML. إنه مكتوب على النحو التالي:

لنفس سبب المقالة السابقة ، يجب أيضًا تعيين قيمة الخاصية المحددة لعلامة <Spoint> في خيار <select> بقيمة:

<الخيار المحدد = محدد />

وفقًا لمعيار XHTML ، يجب أن تركز علامات HTML على تمثيل المحتوى ، بدلاً من التحكم في النمط ، ويجب ترك الأنماط إلى CSS لضبطها. لذلك ، تم تجاهل بعض العلامات والسمات القديمة ، مثل <em> العلامات والعلامات التي ستجعل الأحرف الصينية في مائل مائل تظهر بخط مائل ، ولكن <i> العلامات ، التي تم تسميتها ببساطة على اسم الأناقة ، هي بالفعل معيار مهجور ، ويتم استبداله بـ <em> علامات تمثل معنى التركيز. وبالمثل ، تشير السمة align = absmiddle لعلامة <img> إلى أن الصورة تتركز بشكل رأسي ومحاذاة مع النص المجاور. هذه أيضا سمة تمثل النمط. يجب استخدام CSS بدلاً من هذه السمة للتحكم في نمط المحاذاة للصورة لتجنب التأثير المتبادل لعناصر التحكم في النمط.

عند استخدام iframe ، لا يجوز لك عرض حدود iframe عن طريق ضبط الحدود = 0 في IE ، ولكن سمة حدود نافذة الإطار القياسية هي FrameBorder. يجب عليك تعيين FrameBorder = 0 لإخفاء حدود الإطار في متصفحات أخرى خارج IE:

<iframe FrameBorder = 0 />

هذه السمة ، مثل السمة المحاذاة لعلامة <img> ، هي أيضًا سمة تتغلب على مسؤولية HTML لتمثيل أنماط المحتوى وعناصر التحكم. يحدد المسافة بين الوحدات. من وجهة نظر عملية ، من الأفضل عدم تحديد CellPadding ، ولكن استخدام CSS للتحكم في هوامش الخلايا الداخلية.

Nowrap هي سمة تشير إلى أن المحتوى لا يلف تلقائيًا ، ولكن مثل السمة أعلاه ، فهذه سمة تتحكم في نمط. في HTML 4.01 ، لا يتم تفضيل BGColor ، الطول ، العرض ، و Nowrap من علامة <td>. في XHTML 1.0 DTD صارمة ، لا يتم دعم BGColor ، الطول ، العرض ، و Nowrap من علامة <td>.