التعليق: يضيف HTML5 أيضًا بعض العناصر الدلالية البحتة على مستوى الكتلة: جانباً مربع الحوار الشكل ، كنت أستخدم العنصرين الأولين في مقالاتي وكتاباتي. العنصر الثالث الذي لا أستخدمه في كثير من الأحيان ، يتم استخدامه بشكل أساسي في النص المكتوب. بصرف النظر عن العنصر ، يمثل العنصر الوصف ، والمطالبات ، والأشرطة الجانبية ، والاقتباسات ، والتعليقات الإضافية ، وما إلى ذلك ، أي محتوى خارج السطر الرئيسي للسرد. على سبيل المثال ، في المطور
يضيف HTML5 أيضًا بعض عناصر مستوى الكتلة الدلالية البحتة:جانبا الحوار الشكل
لقد كنت أستخدم العنصرين الأولين في مقالاتي وكتاباتي. العنصر الثالث الذي لا أستخدمه في كثير من الأحيان ، يتم استخدامه بشكل أساسي في النص المكتوب.
جانبا
يمثل العنصر جانبًا الوصف ، والمطالبات ، والأشرطة الجانبية ، والاقتباسات ، والتعليقات الإضافية ، وما إلى ذلك ، أي المحتوى خارج السطر الرئيسي للسرد. على سبيل المثال ، في مقالات المطورين ، غالبًا ما ترى الأشرطة الجانبية المكتوبة في نموذج الجدول ، انظر الرمز 3 ، الشريط الجانبي للمطورات المكتوبة في HTML4.
<tablealign = rightBorder = 0cellpadding = 0cellpacing = 0width = 40 ٪>
<tbody> <tr> <tdwidth = 10>
<imgalt = src = // www.ibm.com/i/c.gifheight=1width=10> </td>
<td>
<tableborder = 1cellpadding = 5cellpacing = 0width = 100 ٪>
<tbody> <tr> <tdbgColor =#eeeeeee>
<p> <aname = xf-value> <spanclass = smalltitle> .xf-value </span> </a> </p>
<p>
<CODETYPE = inline> .xf-value </code> SelectoreSederSedHerestyLestheinput
FieldValueButNotitslabel. هذا في الواقع
withTheCurrentCss3Draft.TheExamplereally يجب أن يكون
<codetype = inline> :: value </code> pseudo-classinsteadlikeso:
</p>
<tableborder = 0cellpadding = 0cellpacing = 0width = 100 ٪>
<Tbody> <tr> <tdClass = Code-OutLine>
<preclass = displayCode> input :: value {width: 20em ؛}
#ccnumber :: value {width: 18em}
#zip :: value {width: 12em}
#state :: value {width: 3em} </pre>
</td> </tr> </tbody> </table> <br>
<p>
ومع ذلك ، لا يحتوي Firefox على tyetsupport thissyntax.
</p>
</td> </tr> </lood>
في HTML5 ، يمكنك كتابة هذا الشريط الجانبي بطريقة أكثر جدوى ، راجع الشريط الجانبي للمطور 4 من Code 4 في HTML5.
<جانب جانب>
<h3> .xf-value </h3>
<p>
<CODETYPE = inline> .xf-value </code> SelectoreSederSedHerestyLestheinput
FieldValueButNotitslabel. هذا في الواقع
withTheCurrentCss3Draft.TheExamplereally يجب أن يكون
<codetype = inline> :: value </code> pseudo-classinsteadlikeso:
</p>
<preclass = displayCode> input :: value {width: 20em ؛}
#ccnumber :: value {width: 18em}
#zip :: value {width: 12em}
#state :: value {width: 3em} </pre>
<p>
ومع ذلك ، لا يحتوي Firefox على tyetsupport thissyntax.
</p>
</isside>
يمكن للمتصفح أن يقرر مكان وضع هذا الشريط الجانبي (قد يتطلب رمز CSS صغير).
شكل
يمثل عنصر الشكل صورة على مستوى الكتلة وقد يتضمن أيضًا الأوصاف. على سبيل المثال ، في العديد من مقالات المطورين ، يمكنك أن ترى أن نتيجة وضع العلامات على الرمز 5 لمخطط المطورين المكتوب في HTML4 يظهر في الشكل 1.
<name = fig2> <b> figure2.installmozillaxformsdialog </b> </a> <br/>
<imgalt = AwebsiteIsRequestingPermissionToInstallTheFollowingItem:
mozillaxforms0.7unsigned
src = installDialog.jpgBorder = 0height = 317hspace = 5vspace = 5width = 331/>
<br/>
الشكل 1. InstallMozillAxformsDialog
في HTML5 ، يمكنك كتابة هذا الرسم التخطيطي بطريقة أكثر دلالة ، انظر مخطط Code 6 DeveloperWorks المكتوب في HTML5.
<guraliD = fig2>
<GRING> Figure2.InstallMozillaxformsDialog </legend>
<imgalt = AwebsiteIsRequestingPermissionToInstallTheFollowingItem:
mozillaxforms0.7unsigned
src = installDialog.jpgBorder = 0height = 317hspace = 5vspace = 5width = 331/>
</figure>
الأهم من ذلك ، يمكن للمتصفحات (وخاصة قراء الشاشة) ربط الصور والأوصاف بوضوح.
لا يمكن لعناصر الشكل عرض الصور فقط. يمكنك أيضًا استخدامه لتحديد العناصر الصوتية والفيديو والكائن والكائن والعناصر المدمجة.
مربع الحوار
يمثل عنصر الحوار محادثة بين العديد من الأشخاص. يمكن أن يمثل عنصر HTML5DT السماعة ، ويمكن أن يمثل عنصر HTML5DD محتوى الكلام. لذلك ، يمكن أيضًا عرض المحادثات بطريقة معقولة في المتصفحات القديمة. يعرض الرمز 7 محادثة شهيرة على DialogueConming's DealogueConning the TwoChiefWorldSystems.
الرمز 7. حوار الجليل المكتوب في HTML5
<ariog>
<dt> Simplicius </dt>
<dd> وفقًا لـ thestrightlieaf ،
وليس وفقًا للمنحنى ،
forsuchause. </dd>
<dt> sagredo </dt>
<dd> butishouldtakene thoreofthem ،
رؤية أن thestraightlineafrunsoLiquely.ishould
drawlinependiculy tocd ، سوف يبدو توميس
Tobetheshortest ، AswellasBeingUniqueamongthe
infinitenumberoflongerandunequalones التي ربما
تم سحبها من نقطة atoever على العكس
linecd. </dd>
<dt> salviati </dt>
<dd> <p> yourchoice و thereate لك
aduceforitseemtomeMostexCellent.sonowwehaveit
أن البعد الأول يتم تحديد byastraightline.
هذه (وهي اتساع) byanotherstraightline ، و
notonlystraight ، butatanglestothat التي
DetionationsHeLength.Thuswehave تعريف thetwo
أبعاد السطح. trisis ، lengthandbreadth. </p>
<p> butsupposeyouhadtodetermineaheight - بالنسبة
على سبيل المثال ، HowhightSplatformisFromThePavementDown
أدناه هناك
maydrawinfinitelines ، curvedorstraight ، andallof
أطوال مختلفة ، إلى النقطة اللانهائية حتى الرصيف
أدناه ، ما هي السقوط التي ستسقطها youmakeuseof؟ </p>
</dd>
</dialog>
لا يزال هناك جدل حول بناء الجملة الدقيق لهذا العنصر. يريد بعض الناس تضمين النصوص غير الجاهزة في عناصر الحوار (مثل أوصاف المرحلة في البرامج النصية) ، والبعض الآخر لا يحب دور تمديد عناصر DT و DD. على الرغم من الجدل حول قواعد محددة ، يعتقد معظم الناس أن التعبير عن المحادثات بطريقة دلالية أمر جيد.
(يتبع)