صفت خصوصی label در HTML5 درون تگ track و option

در این مقاله از سایت آموزی جهت آگاهی شما کاربران محترم قصد داریم به معرفی و کاربرد صفت خصوصی label در html بپردازیم.

صفت label ، مخصوص تگ track ، تگ option و تگ optgroup در سند html می باشد. صفت label برای تگ track در نسخه جدید HTML5 معرفی شده است.

معرفی و کاربرد صفت خصوصی label در html

صفت label ، مخصوص تگ track ، تگ option و تگ optgroup در سند html می باشد. ویژگی خصوصی label برای تگ track در نسخه جدید HTML5 معرفی شده است. در صورتی که خاصیت label ، برای تگ option و تگ optgroup در نسخه HTML4.01 نیز وجود داشته است.

خاصیت label درون تگ track یک عنوان برای متن زیرنویس آهنگ یا ویدئو مشخص می نماید. ویژگی خصوصی label برای تگ option ، یک نسخه کوتاه تر از یک محتوا در تگ option را مشخص می کند. صفت label برای تگ optgroup ، یک برچسب برای تگ optgroup مشخص می نماید.

مثال در مورد استفاده از صفت خصوصی label در HTML درون تگ track

<video width=”320″ height=”240″ controls>
<source src=”forrest_gump.mp4″ type=”video/mp4″>
<source src=”forrest_gump.ogg” type=”video/ogg”>
<track src=”subtitles_en.vtt” kind=”subtitles” srclang=”en” label=”English”>
<track src=”subtitles_no.vtt” kind=”subtitles” srclang=”no” label=”Norwegian”>
</video>

همانطور که در مثال بالا ملاحظه می فرمایید، درون تگ video ، تگ source و تگ track آمده است.

همچنین درون تگ های track ، صفت label با مقادیر English و Norwegian آمده است. که نمایانگر عنوان برای متن زیرنویس ویدئو در سند html است.

مثال در مورد استفاده از ویژگی خصوصی label در تگ option

<select>
<option label=”Volvo”>Volvo (Latin for “I roll”)</option>
<option label=”Saab”>Saab (Swedish Aeroplane AB)</option>
<option label=”Mercedes”>Mercedes (Mercedes-Benz)</option>
<option label=”Audi”>Audi (Auto Union Deutschland Ingolstadt)</option>
</select>

خروجی کد در مرورگر اینترنتی

مثال در مورد استفاده از صفت خصوصی label در HTML درون تگ optgroup

<select>
<optgroup label=”Swedish Cars”>
<option value=”volvo”>Volvo</option>
<option value=”saab”>Saab</option>
<optgroup label=”German Cars”>
<option value=”mercedes”>Mercedes</option>
<option value=”audi”>Audi</option>
</optgroup></optgroup></select>