آموزش تگ 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

امتحان کنید

مثال شماره ۲ : مشخص کردن جهت متن یک صفحه ( عدم استفاده از تگ bdi )

امتحان کنید

Free-Learn

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

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

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

Free-Learn

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

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

Free-Learn

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

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

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

Free-Learn