کاربردهای کمتر شناخته شده از ویژگی های بهتر شناخته شده - مجله Smashing
انتشار: دی 19، 1403
بروزرسانی: 30 خرداد 1404

کاربردهای کمتر شناخته شده از ویژگی های بهتر شناخته شده - مجله Smashing


لیست ویژگی های موجود در HTML طولانی و مستند است. حتی اگر آنها را حفظ نکرده باشید (و هیچ مشکلی برای یک نویسنده وجود ندارد... یک فرد تصادفی در خیابان، که دارد)، یک سری مکان وجود دارد که ویژگی های HTML که با آنها آشنا هستید متفاوت یا خاص تر هستند. مشاغل بیایید نگاهی بیندازیم.

name

ممکن است در مورد آن شنیده باشید name ویژگی، دادن نام/برچسب به اطلاعات ارسال شده از طریق فرم. و به طور خاص، ممکن است از آن برای جمع آوری مجموعه ای از دکمه های رادیویی استفاده کرده باشید، اما می توانید از آن نیز با استفاده از آن استفاده کنید details عنصری که در هر زمان تنها یکی از مجموعه آکاردئون ها باز باشد.

مثلاً اگر در محل کارتان بیش از یک یخچال دارید، هر فرد محترمی هر بار فقط یک در را باز می کند. درسته باب؟

Refrigerator 1 Lunches, condiments, yogurt et al.
Refrigerator 2 More Lunches, leftovers from client meeting, stray cans of off-brand soda et al.
Refrigerator 3 Cookie dough someone bought from somebody’s child’s fundraiser, expired milk, unidentifiable meat et al.

به قلم (نام (چنگال شده)) (https://codepen.io/smashingmag/pen/pvzWbmR) توسط موسسه Undead مراجعه کنید.

به نام قلم (چنگال شده) توسط موسسه Undead مراجعه کنید.

title

احتمالاً در مورد ویژگی جهانی شنیده اید title. معمولاً به عنوان متن راهنمای ابزار داخلی در نظر گرفته می شود، اما سه عنصر دارای معنای خاصی برای ویژگی عنوان هستند: input و جواهراتی که به ندرت استفاده می شوند، تعریف (dfn) عنصر و مخفف (abbr) عنصر.

اگر از a استفاده می کنید pattern صفت بر روی یک input برای ارائه برخی تصحیح خطاهای مبتنی بر regex، قطعاً باید به کاربر بگویید که چگونه معیارهایی را که استفاده می کنید برآورده کند. این title ویژگی می تواند هم به عنوان راهنمای ابزار و هم به عنوان پیام نمایش داده شده در زمانی که کاربر آن معیار را برآورده نمی کند استفاده شود.

به قلم (عنوان - ورودی (چنگال شده)) (https://codepen.io/smashingmag/pen/OPLxXeJ) توسط موسسه Undead مراجعه کنید.

به عنوان قلم - ورودی (چنگال شده) توسط موسسه Undead مراجعه کنید.

برای یک dfn عنصر، در صورت استفاده از title ویژگی، پس باید شامل عبارت تعریف شده باشد. dfn باید همچنان متنی در آن باشد، اما می تواند مخفف یا شکل دیگری از اصطلاح باشد.

OYG’s are a pox on humanity. Stealing yogurts from the office fridge even when they are labeled.

به قلم (عنوان - dfn (چنگال شده)) (https://codepen.io/smashingmag/pen/ZYzXOdJ) توسط موسسه Undead مراجعه کنید.

به عنوان قلم - dfn (چنگال شده) توسط موسسه Undead مراجعه کنید.

الف title روی یک abbr عنصر نه تنها راهنمای ابزار را تنظیم می کند، بلکه به صراحت دارای بسط مخفف یا مخفف است. همانطور که در مشخصات می گوید: «ویژگی (عنوان)، در صورت مشخص شدن، باید شامل بسط اختصار باشد و هیچ چیز دیگری.» این مشخصات معادل تهدید یک ضربه مافیایی است اگر مراقب کارهای خود نباشید title صفات به شما هشدار داده شده است، باب.

When dealing with a suspected yogurt thief, we must create a HRSTFYT to deal with the problem.

به قلم (عنوان - abbr (چنگال شده)) (https://codepen.io/smashingmag/pen/ogvGLrQ) توسط موسسه Undead مراجعه کنید.

به عنوان قلم - abbr (چنگال شده) توسط موسسه Undead مراجعه کنید.

value

این value ویژگی برای تنظیم مقادیر پیش فرض شناخته شده است inputs، اما می توانید از آن در یک آیتم لیست نیز استفاده کنید (li) در یک لیست مرتب شده (ol) برای تغییر شماره آن آیتم و همه مواردی که به دنبال آن هستند. این فقط اعداد صحیح می گیرد، اما شما می توانید بدون توجه به نوع لیست مرتب شده ای که استفاده می کنید (اعداد، حروف الفبا یا رومی) از آن استفاده کنید.

  1. Tina
  2. Keesha
  3. Carlos
  4. Jamal
  5. Scott
  6. Bob
  7. Bobbie
  8. Bobby
  9. "Rob"

به قلم (ارزش (چنگال شده)) (https://codepen.io/smashingmag/pen/WbeZxVx) توسط موسسه Undead مراجعه کنید.

به ارزش قلم (چنگال شده) توسط موسسه Undead مراجعه کنید.

datetime

شاید از الف استفاده کرده باشید datetime صفت بر روی الف time عنصری برای ارائه یک قالب قابل خواندن توسط ماشین از زمان و/یا تاریخ نشان داده شده در time متن عنصر:

همین ویژگی را می توان با استفاده از ins و del عناصر (به ترتیب برای یادداشت اضافه/درج و حذف محتوا استفاده می شود). این datetime مشخصه روشن ins و del یک تاریخ قابل خواندن توسط ماشین (و در صورت اختیاری یک زمان) برای زمانی که تغییر ایجاد شده است را ارائه می دهد. در صورت تمایل می توانید آن را به بازدید کننده نشان دهید، اما عمدتاً برای استفاده خصوصی در نظر گرفته شده است.

ویرایش های نسخه اصلی نمونه قبلی را بررسی کنید:

When dealing with a  yogurt thief , like Bob, we must create a HRSTFYT to deal with Bob .

به قلم (Datetime (چنگال شده)) (https://codepen.io/smashingmag/pen/VYZMjog) توسط موسسه Undead مراجعه کنید.

تاریخ قلم (چنگال شده) توسط موسسه Undead را ببینید.

به عنوان یک نکته اضافه، اسکرین خوان ها این کار را انجام می دهند نه را اعلام کند datetime ویژگی در این زمینه

cite

چسبیدن به دوستانی که اغلب نادیده گرفته می شوند ins و del، cite مشخصه ای که روی آن استفاده می کنید blockquote و q عناصری برای ارائه URL منبع نقل قول نیز می توانند مورد استفاده قرار گیرند ins و del برای ارائه URL سندی که تغییرات را توضیح می دهد.

When dealing with a  yogurt thief , like Bob, we must create a HRSTFYT to deal with Bob .

به قلم (نقل (نقل از چنگال)) (https://codepen.io/smashingmag/pen/QwLqKLK) توسط موسسه Undead مراجعه کنید.

استناد قلم (چنگال شده) توسط موسسه Undead را ببینید.

باز هم، این تاریخ ها در فناوری کمکی مانند صفحه خوان ها اعلام نشده اند.

multiple

شما احتمالا می دانید multiple ویژگی به عنوان ویژگی «بیشتر از دیدار با چشم» که یک منوی کشویی را به یک کادر چند انتخابی تبدیل می کند، مانند یک همکار که به شما اجازه می دهد دو دونات را از کادر انتخاب کنید. (من به تو نگاه می کنم، تینا.) اما دو کاربرد دیگر نیز دارد. می توانید آن را به هر دو فایل اضافه کنید input و یک email ورودی برای پذیرش چندین فایل و ایمیل، به ترتیب.

فقط مطمئن شوید که ایمیل ها با کاما از هم جدا شده اند.

به قلم (چندین (چنگال شده)) (https://codepen.io/smashingmag/pen/JoPrRPB) توسط موسسه Undead مراجعه کنید.

به قلم چندگانه (چنگال شده) توسط موسسه Undead مراجعه کنید.

for

در سفرهای خود در سراسر اینترنت، احتمالاً با آن برخورد کرده اید for ویژگی زمانی که از آن برای مرتبط کردن a استفاده می شود label عنصر با فیلد فرم (input، select، textareaو غیره)، اما می توانید از آن برای ارتباط صریح عناصر یک محاسبه با output عنصر

بر خلاف الف label-input رابطه، که یک رابطه یک به یک است (یعنی یک برچسب برای یک فیلد)، the for ویژگی مورد استفاده در an output می تواند فهرستی نامرتب و جدا از فاصله از شناسه های فیلدهایی که در محاسبه نقش داشته اند را در خود جای دهد.

به قلم (For (forked)) (https://codepen.io/smashingmag/pen/pvzWEoe) توسط موسسه Undead مراجعه کنید.

به قلم برای (چنگال شده) توسط موسسه Undead مراجعه کنید.

target

همانطور که می توانید از a استفاده کنید target ویژگی برای باز کردن پیوند در یک برگه/پنجره جدید، می توانید از همان ویژگی استفاده کنید target صفت و ارزش _blank داشتن یک form پاسخ را در یک برگه/پنجره جدید باز کنید.

disabled

ممکن است از آن استفاده کرده باشید disabled ویژگی برای حذف کردن یک فیلد فرم فردی fieldset عنصر

مهم نیست منابع انسانی چه می گوید و اخلاق بی گناه تا اثبات گناه، همه ما می دانیم که باب این کار را انجام داده است. ما نه؟

به قلم (نافعال (چنگال شده)) (https://codepen.io/smashingmag/pen/emOGdme) توسط موسسه Undead مراجعه کنید.

Pen Disabled (چنگال شده) توسط موسسه Undead را ببینید.

انتخابگرهای ویژگی

اگرچه از نظر فنی یک نکته HTML نیست، ویژگی ها می توانند به عنوان انتخابگر در CSS نیز استفاده شوند. دور نام ویژگی را براکت قرار می دهید و تمام عناصری که حاوی آن ویژگی هستند را انتخاب می کنید.

  1. Fred
  2. Rhonda
  3. Philomina
  4. Cranford
  5. Scott
  6. Bob
  7. Bobbie
  8. Bobby
  9. "Rob"

به قلم (انتخاب کننده ویژگی (چنگال شده)) (https://codepen.io/smashingmag/pen/OPLxRVV) توسط موسسه Undead مراجعه کنید.

به انتخابگر ویژگی قلم (چنگال شده) توسط موسسه Undead مراجعه کنید.

در واقع کارهای بسیار بیشتری می توانید با انتخابگرهای ویژگی انجام دهید، اما این موضوع مقاله دیگری است - به معنای واقعی کلمه.

بسته بندی

خوب، اکنون که ما چیزهای بی اهمیتی را یاد گرفتیم که می توانیم از آنها برای پیگرد قانونی تخلفات دفتر باب و ماست استفاده کنیم، آیا ویژگی HTML مورد علاقه ای دارید که من در مورد آن صحبت نکردم؟ انرژی زندگی شخصی خود را در نظرات به نمایش بگذارید. (و بله، افراد باحال یک ویژگی HTML مورد علاقه دارند... واقعاً افراد باحال... درست است؟ درست است!؟!؟!؟!؟!)

سرمقاله Smashing(gg, yk)

منبع: https://smashingmagazine.com/2025/01/lesser-known-uses-better-known-attributes/