---
title: HTML Iframes
description: "> HTML iframe нь вэб хуудсан дахь вэб хуудсыг харуулахад хэрэглэгддэг. ##   ## HTML Iframe синтакс HTML `` тэмдэглэгээ нь дотоод хүрээг(inline frame) тодорхойлдог Дотоод хүрээ(inline frame) нь одоогийн HTML баримт бичигт өөр баримт бичгийг оруулахад ашиглагддаг. `` **Tip:** It…"
url: "https://apprentice.mn/docs/html-iframes/"
updated: "2021-07-07"
category: HTML
---

# HTML Iframes

> HTML iframe нь вэб хуудсан дахь вэб хуудсыг харуулахад хэрэглэгддэг.

##  

## HTML Iframe синтакс

HTML `<iframe>` тэмдэглэгээ нь дотоод хүрээг(inline frame) тодорхойлдог

Дотоод хүрээ(inline frame) нь одоогийн HTML баримт бичигт өөр баримт бичгийг оруулахад ашиглагддаг.

       `<iframe src="url" title="description">`

**Tip:** It is a good practice to always include a `title` attribute for the `<iframe>`. This is used by screen readers to read out what the content of the iframe is.

Зөвлөгөө`<iframe>` -т `title`шинж чанарыг байнга оруулах нь сайн дадлага юм. Үүнийг дэлгэц уншигчид iframe-ийн агуулга юу болохыг уншихад ашигладаг.

## Iframe – Өндөр ба өргөнийг тохируулах

Use the `height` and `width` attributes to specify the size of the iframe.

`height` ба`width`  шинж чанаруудыг ашиглан iframe-ийн хэмжээг зааж өгдөг.

Өндөр ба өргөнийг пикселээр зааж өгсөн болно:

     `<iframe src="demo_iframe.htm" height="200" width="300" title="Iframe Example"></iframe>`

Эсвэл та`style` шинж чанар ашигла CSS-ийн `height` болон`width`-ийг ашиглаж болно:

     `<iframe src="demo_iframe.htm" style="height:200px;width:300px;" title="Iframe Example"></iframe>`

## Iframe -Хүрээг хасах

iframe нь анхнаасаа хүрээтэй байдаг

Хүрээг хасахын тулд,  `style` шинж чанарыг нэмээд  CSS-ийн `border` -ийг ашиглана:

### Жишээ

      `<iframe src="demo_iframe.htm" style="border:none;" title="Iframe Example"></iframe>`

CSS-ээр, та iframe-ийн хүрээний хэмжээ, хэв маяг, өнгийг өөрчилж болно.

     `<iframe src="demo_iframe.htm" style="border:2px solid red;" title="Iframe Example"></iframe>`

## Iframe -Холбоос руу чиглүүлэх

Iframe-г холбоосын зорилтот хүрээ болгон ашиглаж болно.

 `target` attribute of the link must refer to the `name` attribute of the iframe:

холбоосын `target` шинж чанар нь iframe-ийн `name`  шинж чанарыг харуулсан байх ёстой:

### Жишээ

      `<iframe src="demo_iframe.htm" name="iframe_a" title="Iframe Example"></iframe>

<p><a href="https://www.w3schools.com" target="iframe_a">W3Schools.com</a></p>`

- ## Chapter Summary

  - HTML `<iframe>` дотоод хүрээг тодорхойлно
  - `src` шинж чанар нь оруулах хуудасны URL-ийг тодорхойлдог
  -  `title` шинж чанарыг үргэлж бичих ёстой(дэлгэц уншигчидад зориулж)
  - `height` болон`width`шинж чанар нь iframe-ийн өргөн болон өндөрийг тохируулдаг
  - `border:none;` -ийг ашиглаж iframe-ийн хүрээг устгана

        [https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fhtml-iframes%2F&linkname=HTML%20Iframes](https://www.addtoany.com/add_to/facebook?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fhtml-iframes%2F&linkname=HTML%20Iframes)[https://www.addtoany.com/add_to/mastodon?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fhtml-iframes%2F&linkname=HTML%20Iframes](https://www.addtoany.com/add_to/mastodon?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fhtml-iframes%2F&linkname=HTML%20Iframes)[https://www.addtoany.com/add_to/email?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fhtml-iframes%2F&linkname=HTML%20Iframes](https://www.addtoany.com/add_to/email?linkurl=https%3A%2F%2Fapprentice.mn%2Fdocs%2Fhtml-iframes%2F&linkname=HTML%20Iframes)[https://www.addtoany.com/share](https://www.addtoany.com/share)