القيمة الدلالية للامتداد

Question

يبدو أن عنصر الامتداد يشبه تمامًا div، ولكن على مستوى السطر وليس على مستوى الكتلة.ومع ذلك، لا يبدو أنني أفكر في أي تقسيمات منطقية مفيدة يمكن أن يوفرها عنصر الامتداد.

يبدو أن الجملة الواحدة، أو الكلمة إذا لم تكن واردة في جملة، هي أصغر جزء منطقي.تجاهل CSS، نظرًا لأن CSS مخصص للتخطيط فقط وليس للمعنى الدلالي، متى يوفر الامتداد قيمة دلالية إضافية عن طريق تقطيع جملة أو سلسلة من الكلمات?

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

Answer 1

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

ثم نادى الساحر على <span class="wizardword">gravenwist</span> وأمره بمهاجمة الجيش الذي يقترب.قاوم <span class="wizardword">gavenwist</span> ولكن <span class="wizardword">wistwand</span> الخاص بالمعالج كان قويًا جدًا.

هذا يمكن أن يجعل كما

ثم دعا المعالج Gravenwist وأمرها بمهاجمة الجيش الذي يقترب.ال Givenwist قاوم ولكن المعالج com.wistwand كانت قوية جدًا.

مثال جيد آخر على هذا النوع من الأشياء تنسيقات دقيقة, ، والتي تسمح بإنشاء بنية عشوائية داخل HTML:

<span class="tel">
 <span class="type">home</span>:
 <span class="value">+1.415.555.1212</span>
</span>

تتمثل ميزة الامتداد، مقابل div، في أن الامتدادات يمكن أن تظهر في كل مكان تقريبًا لأنها محتوى مضمن، وdivs عبارة عن عناصر كتلة، لذا لا يمكن أن تظهر إلا داخل عناصر أخرى معينة.

Answer 2

ستكون الفائدة المفيدة جدًا هي تحديد التغييرات في اللغة.على سبيل المثال

<p>Welcome to Audi UK, <span lang="de">Vorsprung durch Technik</span>.</p>

يمكن لقارئات الشاشة ذات الإمكانات اللغوية المتعددة الاستفادة من هذا.

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

Answer 3

<div class="name">
  <span class="firstname">John</span>
  <span class="lastname">Doe</span>
</div>

يعتمد الأمر كليًا على ما تريد التعبير عنه.إذا كان ترميز الاسم الأول ذا قيمة دلالية بالنسبة لك (سواء كان ذلك فقط للحصول على رابط لـ CSS لتنسيق الأسماء الأولى أو لاستخراجها باستخدام بعض لغات البرمجة النصية)، فيمكنك استخدام امتداد.

Answer 4

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

<span datafield="firstname"></span>

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

Answer 5

spanس يستطيع في الواقع تكون ناقلات للمعلومات الدلالية في شكل class صفات.يتم استخدام هذا بواسطة تنسيقات microformat.

Answer 6

تحتاج علامات الامتداد إلى فئة أو سمة معرف لمنحها معنى.

على سبيل المثال<span class="personal_phone_number">0123 456789</span>

Answer 7

تجاهل CSS ، لأن ذلك سيعطي المعنى الدلالي ، متى توفر SPAN قيمة دلالية إضافية عن طريق تقطيع جملة أو سلسلة من الكلمات؟

تجاهل CSS (وغيرها من علامات HTML)، أبدًا.أ<span> الغرض الوحيد في الحياة هو حمل العلامات التي لا يمكنك التعبير عنها بتنسيق HTML.العلامات مثل <span style="dropCap">، والذي ليس له ما يعادله في HTML ولكنه موجود في النشر المطبوع منذ مئات السنين، والذي يتم تطبيقه دائمًا على حرف واحد فقط - الحرف الأول من العنصر (مقال، أيًا كان)، دون التسبب في فاصل الكلمات (أو أي استراحة أكبر).

يبدو أنه في جميع الحالات ، تكون العناصر الأخرى أكثر ملاءمة لإضافة قيمة دلالية ، مما يجعل SPAN عنصر تخطيط بحت.هل هذا صحيح؟

نعم و لا.القيمة الحقيقية الوحيدة لـ <span> هو أنه محايد لغويا.أي على عكس على سبيل المثال <p>، فهو لا يفعل أي شيء قد ترغب في ألا يفعله عندما تستخدمه لحمل علامات أخرى.وهناك أوقات مثل <span style="dropCap"> أعلاه، عندما لا تريد أي تأثيرات أخرى.

Answer 8

إذا كنت تريد تطبيق قواعد التنسيق على جزء من محتويات العلامة (على سبيل المثال، كلمة واحدة أو جملة واحدة).يمكنك استخدام علامة الامتداد.ويسمى أحيانًا التنسيق بدون علامات.

أستخدم الامتدادات في محول EBNF -> XHTML الخاص بي لتطبيق تنسيق مختلف على القيم الحرفية والرموز المميزة.

Answer 9

تعتبر عناصر SPAN (و DIV) في حد ذاتها محايدة لغويًا بشكل عام.الأسلوب الجيد هو استخدام العلامات الدلالية قدر الإمكان، ولكن في بعض الأحيان تواجه مواقف تكون فيها عناصر html الحالية التي توفر المعنى الدلالي (EM، STRONG، ABBR، ACRONYM، إلخ، إلخ) غير مناسبة من الناحية الدلالية. للمحتوى الخاص بك.لذا فإن الخطوة التالية هي استخدام SPAN أو DIV محايدًا لغويًا مع معرف أو فئة ذات معنى لغويًا.

Answer 10

أعتقد أنه يسأل عن الفرق بين div وspan، ولا يوجد فرق حقًا، بخلاف السلوك الافتراضي.

إنها مسألة اتفاقية.عند استخدام التصميم، div يستخدم عادةً لتحديد أقسام المحتوى، بينما span يستخدم لترسيم النص المضمن.يمكنك بنفس السهولة استخدام div في كل مكان أو الاستخدام span في كل مكان، ولكن من المفيد التفكير فيهما على أنهما مختلفان، حتى لو كان ذلك من خلال الاتفاقية فقط.

Answer 11

يمكن استخدام HTML للتنسيقات الدقيقة.ولكن بما أن مواصفات HTML الفعلية موجودة XHTML، ليس هناك نقطة.بدلاً من:

<P>Hello, my name is <SPAN class="name"> Joe Sixpack </SPAN></P>

أفضل استخدام:

<P>Hello, my name is <FOAF:name> Joe Sixpack </FOAF:name></P>

Answer 12

معنى SPAN هو "هذا نطاق (عام) للمحتوى (على سبيل المثال، النص)".قارن بـ DIV، وهو ما يعني "هذا تقسيم منطقي (أي قسم مستند عام)".

SPAN هو في الأساس خطاف لتعليق الأنماط (حتى تتمكن من استخدامه <span style='color:blue'> بدلاً من <font color='blue'>).

من المواصفات:

توفر عناصر DIV وSPAN، جنبًا إلى جنب مع سمات المعرف والفئة، آلية عامة لإضافة هيكل إلى المستندات.تحدد هذه العناصر المحتوى ليكون مضمّنًا (SPAN) أو على مستوى الكتلة (DIV) ولكنها لا تفرض أي مصطلحات عرضية أخرى على المحتوى.وبالتالي، يمكن للمؤلفين استخدام هذه العناصر جنبًا إلى جنب مع أوراق الأنماط، وسمة اللغة، وما إلى ذلك، لتخصيص HTML وفقًا لاحتياجاتهم وأذواقهم.

لنفترض، على سبيل المثال، أننا أردنا إنشاء مستند HTML استنادًا إلى قاعدة بيانات لمعلومات العميل.نظرًا لأن HTML لا يتضمن عناصر تحدد كائنات مثل "العميل" و"رقم الهاتف" و"عنوان البريد الإلكتروني" وما إلى ذلك، فإننا نستخدم DIV وSPAN لتحقيق التأثيرات الهيكلية والعرضية المطلوبة.قد نستخدم عنصر TABLE كما يلي لتنظيم المعلومات:

<!-- Example of data from the client database: -->
<!-- Name: Stephane Boyera, Tel: (212) 555-1212, Email: sb@foo.org -->

<DIV id="client-boyera" class="client">
<P><SPAN class="client-title">Client information:</SPAN>
<TABLE class="client-data">
<TR><TH>Last name:<TD>Boyera</TR>
<TR><TH>First name:<TD>Stephane</TR>
<TR><TH>Tel:<TD>(212) 555-1212</TR>
<TR><TH>Email:<TD>sb@foo.org</TR>
</TABLE>
</DIV>

<DIV id="client-lafon" class="client">
<P><SPAN class="client-title">Client information:</SPAN>
<TABLE class="client-data">
<TR><TH>Last name:<TD>Lafon</TR>
<TR><TH>First name:<TD>Yves</TR>
<TR><TH>Tel:<TD>(617) 555-1212</TR>
<TR><TH>Email:<TD>yves@coucou.com</TR>
</TABLE>
</DIV>