آموزش تگ object در HTML

19 شهریور 1401
ارسال شده توسط
آموزش html css

آموزش تگ object در HTML

دوست من سلام امیدوارم حالتون عالی و پر از انرژی باشید. توی این بخش از آموزش html css قراره که با آموزش تگ object در HTML به صورت کامل آشنا بشید.

تگ object در HTML

تگ object را در لغت فارسی میتوانیم به معنی “شیء” معنا کنیم. ما با استفاده از تگ object میتوانیم چیزی که در خارج از یک صفحه وبسایت قرار دارد را در درون یک صفحه وبسایت قرار دهیم.
به عنوان مثال میتوانیم یک عکس ، ویدئو ، فایل PDF و… را با استفاده از این تگ درون یک صفحه وبسایت درج کنیم.

به صورت کلی میتوانیم یک عکس ، ویدئو ، سایت و… را از طریق بهره گیری از این تگ درون یک صفحه وب قرار دهیم.اما بهتر است از ان استفاده نکنیم چون خیلی کار آمد و نیاز نیست زیرا به عنوان مثال برای درج یک عکس، آهنگ و ویدیو به ترتیب از تگ های video, audio, img استفاده میکنیم یا حتی برای قرار دادن فریم در سایت ببهترین گزینه استفاده از تگ iframe است.

چند مثال برای تگ object در HTML

در ادامه دوره آموزشی HTML CSS پروژه محور به چند مثال از تگ object میپردازیم که درک بیشتر و بهتری از این تگ داشته باشید و آسان تر از آن استفاده کنید.

مثال اول: نمایش یک فایل PDF

<body>
    <object data="files/test-object.pdf" width="500" height="300"></object>
</body>

دومین مثال : نمایش یک فایل HTML

<body>
     <object data="files/test-object.html" width="500" height="300"></object>
</body>

مثال شماره ۳ : نمایش عکس درون یک صفحه

<body>
    <object data="files/girls-1.jpg"></object>
</body>

مثال شماره ۴ : قرار دادن سایت وردپرس پوش در صفحه

<body>
    <object data="https://wppush.ir/"></object>
</body>

راستی اگر دنبال آموزش html css پروژه محور هستید می توانید از دوره ی آموزش وردپرس پوش استفاده کنید. جهت مشاهده ی 28 ساعت ویدیو آموزشی با پشتیبانی مادام العمر روی این لینک کلیک کنید

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

در جدول زیر میتوانید مرورگرهای اینترنتی که از تگ object در HTML پشتیبانی میکنند را مشاهده نمایید و بدانید که آیا از مروگر مورد استفاده شما هم پشتیبانی میکنند یا خیر…

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

جدول صفات تگ object در HTML

جدول زیر به شما کمک میکند تا صفات تگ object را به همراه مقادیری را که میتوانیم در این تگ استفاده کنیم را مشاهده نماییدم.

جدول صفات تگ object در HTML

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

تگ object قابلیت پشتیبانی از تمام صفات عمومی و رویدادهای عمومی در HTML دارد.

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

  • لزوما تگ object باید در داخل تگ body قرار گرفته شود و هر متن یا محتوایی که در بین این تگ قرار میگیرد،در صورت عدم پشتیبانی مرورگر از تگ مذکور، کاربر با متن زیر مواجه خواهد شد.
  <object data="MyFile.pdf">
     شرمنده رفیق مثله اینکه مرورگر شما از این تگ پشتیبانی نمی کند.
</object>
  • بدلیل اینکه تگ object فایل های PDF را در صفحه نمایش های بزرگ مثل کامپیوتر ، لپ تاپ نشان میدهد اما در برخی از گوشی های موبایل، قابل نمایش نیست. پس بهترین راه حل برای این مشکل استفاده از تگ Iframe برای نمایش فایل های PDF است.
  • استفاده از تگ video برای نمایش ویدیو ها.
  • استفاده از تگ audio برای  آهنگ ها.
  • استفاده از تگ Iframe برای نمایش صفحات سایت ها.
  • استفاده از تگ img برای نمایش عکس ها.

دستورات CSS پیش فرض

بطور پیش فرض مرورگرها تگ object را بشکل کد هایی مثل کد های CSS نظیر موارد زیر…

object:focus {
    outline: none;
}
برای امتیاز به این نوشته کلیک کنید!
[کل: 1 میانگین: 5]

در صورتی که مشکلی دارید و قادر به حل آن نیستید می توانید با ما در تماس باشید

فرم درخواست پشتیبانی (فرم زیر پست ها)

برچسب ها:

دیدگاهتان را بنویسید