آموزش تگ bdi در HTML

سلام خدمت تمامی دوستان و همراهان محترم سایت آموزشی فری لرن ، امیدوارم که حال همگیتون خوب باشه. لطفا در ادامه با آموزش تگ bdi در HTML با من همراه باشید.

آموزش تگ bdi در HTML

Free-Learn

تگ bdi در HTML

تگ bdi که مخفف ( Bi-Directional Isolation ) می باشد، در لغت به معنی جداسازی دوطرفه یا ( دو جهته ) ، تگی است برای جداسازی یا اینجوریم بگیم برای جهت بندی محتوا در یک صفحه وب.

خب حالا یعنی چی جداسازی دوطرفه یا دو جهته؟! این یعنی اینکه ما بتونیم یک متن رو که فرمتش متفاوت با بقیه متن ها می باشد را بتوانیم به راحتی در یک صفحه ی وب قرار دهیم.

مثال : شاید تا الان برای یکبارم که شده یک متن (جمله) فارسی را تایپ کرده اید و در بین این متن از یک یا چندین کلمه انگلیسی استفاده کرده اید! خب در خروجی اون جمله چگونه نمایش داده خواهد شد؟

یعنی در واقع من متنم رو بصورت زیر (در تصویر زیر) مینویسم ولی در خروجی همانند تصویر زیر نمایش داده می شود.

آموزش تگ bdi در HTML

خب چرا اینجوری میشه؟ دلیلش چیه بنظره شما؟ دلیلش اینه که زبان انگلیسی جهت متنش از چپ به راست (LTR) می باشد ولی زبانی همچون زبان فارسی جهت متنش از راست به چپ می باشد (RTL).

بنابراین تگ bdi میاد و این مشکل رو حل میکنه ، کافیه وقتی میخواید از یک متن انگلیسی در یک متن فارسی استفاده نمایید بیاید و اون متن انگلیسی رو در بین تگ bdi قرار بدهید فقط همین.

Free-Learn

مثال از تگ bdi در HTML

در ادامه میتوانید یک مثال از این تگ را مشاهده نمایید.

مثال شماره ۱ : استفاده از تگ bdi

امتحان کنید

مثال شماره ۲ : مشخص کردن جهت متن یک صفحه با استفاده از صفت dir

امتحان کنید

Free-Learn

پشتیبانی مرورگرها

در جدول زیر میتوانید مشاهده نمایید که آیا مرورگرهای اینترنتی از تگ bdi در HTML پشتیبانی میکنند یا خیر.

نام مرورگر Chrome Firefox Opera Safari IE
پشتیبانی بله بله بله بله خیر

Free-Learn

پشتیبانی از صفات و رویدادهای عمومی

تگ bdi از صفات عمومی و رویدادهای عمومی در HTML پشتیبانی می کند.

Free-Learn

نکات و توضیحات

تگ bdi یک تگ جدید/اضافه شده در HTML5 می باشد.

برای مشخص کردن جهت متن کل صفحه همیشه سعی کنید از صفت dir استفاده نمایید.

Free-Learn

دریافت PDF یا پرینت این مطلب