Maison > interface Web > tutoriel HTML > Comment utiliser l'iframe en HTML ? Introduction à l'utilisation des balises iframe en html

Comment utiliser l'iframe en HTML ? Introduction à l'utilisation des balises iframe en html

不言
Libérer: 2018-10-18 10:17:41
original
4429 Les gens l'ont consulté

Pour ceux qui développent des sites Web, la balise iframe doit être familière. L'élément iframe créera un cadre en ligne (c'est-à-dire un cadre en ligne) qui contient un autre document. Nous pouvons charger les sites Web d'autres personnes ou ce site Web sur nos propres pages de site Web. contenu des autres pages du site, ce prochain article vous présentera donc l'utilisation de l'iframe en html.

Tout d'abord, pour la balise iframe, nous savons déjà que l'élément iframe créera un cadre en ligne (c'est-à-dire un cadre en ligne) qui contient un autre document. Regardons donc directement la balise iframe dans. html Utilisation détaillée de .

Jetons un coup d'œil aux attributs de la balise iframe :

1. aligner : gauche, droite, haut, milieu, bas. Spécifie comment ce cadre doit être aligné par rapport aux éléments environnants. Obsolète. Veuillez utiliser le code de style.

2. bordure de cadre : 1, 0. Utilisé pour spécifier s'il faut afficher une bordure autour du cadre.

3. Hauteur : pixels, %. Utilisé pour spécifier la hauteur de l'iframe.

4. description longue : URL. Spécifie une page qui contient une description plus longue de l'iframe.

5. hauteur de marge : pixels. Définissez les marges supérieure et inférieure de l'iframe.

6. largeur de marge : pixels. Définissez les marges gauche et droite de l'iframe.

7. nom : nom_cadre. Spécifie le nom de l'iframe.

Remarque : Si vous souhaitez ouvrir le lien dans une iframe en cliquant sur un lien sur la page, il vous suffit d'ajouter l'attribut name dans l'iframe et l'attribut target dans la balise a (l'attribut target de la balise précise où ouvrir le document lié) Réglez-le simplement sur la même valeur, par exemple :

<iframename="my"></iframe>
<ahref="//m.sbmmt.com" target="my"></a>
Copier après la connexion

8. défilement : oui, non, auto. Spécifie s'il faut afficher les barres de défilement dans l'iframe.

9.src : URL. Spécifie l'URL du document à afficher dans l'iframe.

10. largeur : pixels. %. Définissez la largeur de l'iframe.

Après avoir lu les connaissances pertinentes sur les attributs des balises iframe, jetons un coup d'œil à Le but des balises iframe en HTML

Habituellement, nous utilisons iframe pour imbriquer directement les balises iframe sur la page Précisez simplement le src

L'exemple est le suivant :

<!-- 
        <iframe> 标签规定一个内联框架
     这里写p 标签是为了看align的效果
     -->
     <p style="overflow: hidden;">这是一些文本。 这是一些文本。 这是一些文本。这是一些文本。 这是一些文本。 这是一些文本。
         <iframe name="myiframe" id="myrame" src="external_file.html" frameborder="0" align="left" width="200" height="200" scrolling="no">
            <p>你的浏览器不支持iframe标签</p>
        </iframe>
     这是一些文本。 这是一些文本。 这是一些文本。这是一些文本。 这是一些文本。 这是一些文本。</p>
Copier après la connexion

L'attribut src de l'iframe dans le code ci-dessus est une page html locale

Le code est la suivante :

<body>
    <div id="div" style="height: 300px; background: #ddd;">这是一个外部文件里面的内容</div>
</body>
<script>
    var div = document.getElementById("div");
    console.log(div);
</script>
Copier après la connexion

Remarque : Toutes les parties interactives sont également écrites dans cette page et l'iframe sera automatiquement transférée vers la page importée.

Cet article se termine ici. Pour un contenu plus passionnant, vous pouvez suivre le site Web php chinois ! ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal