logo

Ramki iframe HTML

HTML Iframe służy do wyświetlania zagnieżdżonej strony internetowej (strony internetowej na stronie internetowej). HTML

Element iframe HTML osadza inny dokument w bieżącym dokumencie HTML w obszarze prostokątnym.

Treść strony internetowej i zawartość elementu iframe mogą ze sobą współdziałać za pomocą JavaScript.

komentarz XML

Składnia iframe

Element iframe HTML jest definiowany za pomocą

 <iframe src="URL"></iframe> 

Tutaj atrybut „src” określa adres internetowy (URL) strony z ramką wstawioną.

Ustaw szerokość i wysokość elementu iframe

Możesz ustawić szerokość i wysokość elementu iframe, używając atrybutów „width” i „height”. Domyślnie wartości atrybutów są podawane w pikselach, ale można je także ustawić w procentach. tj. 50%, 60% itd.

Przykład: (piksele)

 <h2>HTML Iframes example</h2> <p>Use the height and width attributes to specify the size of the iframe:</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Przetestuj teraz

Przykład: (procent)

 <h2>HTML Iframes</h2> <p>You can use the height and width attributes to specify the size of the iframe:</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Przetestuj teraz

Możesz także użyć CSS, aby ustawić wysokość i szerokość ramki iframe.

Przykład:

 <h2>HTML Iframes</h2> <p>Use the CSS height and width properties to specify the size of the iframe:</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Przetestuj teraz

Usuń obramowanie elementu iframe

Domyślnie ramka iframe zawiera wokół siebie obramowanie. Możesz usunąć granicę, używając atrybutu i właściwości CSS border.

jak zamknąć tryb programisty

Przykład:

 <h2>Remove the Iframe Border</h2> <p>This iframe example doesn&apos;t have any border</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Przetestuj teraz

Możesz także zmienić rozmiar, kolor i styl obramowania elementu iframe.

Przykład:

 <h2>Custom Iframe Border</h2> <iframe src="https://www.javatpoint.com/"></iframe> 
Przetestuj teraz

Element docelowy elementu iframe dla łącza

Możesz ustawić docelową ramkę dla łącza, używając elementu iframe. Określony atrybut docelowy łącza musi odnosić się do atrybutu nazwy elementu iframe.

Przykład:

 <h2>Iframe - Target for a Link</h2> <iframe src="new.html" name="iframe_a"></iframe> <p> <a href="https://www.javatpoint.com">JavaTpoint.com</a> </p> <p>The name of iframe and link target must have same value else link will not open as a frame. </p> 
Przetestuj teraz

Wyjście

Ramki iframe HTML

nowy kod wyjściowy.hmtl:

 p{ font-size: 50px; color: red;} <p>This is a link below the ifarme click on link to open new iframe. </p> 

Osadź wideo z YouTube za pomocą elementu iframe

Możesz także dodać film z YouTube na swoją stronę internetową za pomocą

Oto kilka kroków, jak dodać film z YouTube na swoją stronę internetową:

  • Przejdź do filmu na YouTube, który chcesz osadzić.
  • Kliknij UDOSTĘPNIJ ➦ pod filmem.
  • Kliknij opcję Osadź.
  • Skopiuj kod HTML.
  • Wklej kod do swojego pliku HTML
  • Zmień wysokość, szerokość i inne właściwości (zgodnie z wymaganiami).

Przykład:

 <iframe src="https://www.youtube.com/embed/JHq3pL4cdy4" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> <iframe src="https://www.youtube.com/embed/O5hShUO6wxs" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture">></iframe> 
Przetestuj teraz

Wyjście:

lista tablic sortowania Java
Ramki iframe HTML

Atrybuty

Nazwa atrybutu Wartość Opis
Zezwól na tryb pełnoekranowy Jeśli to prawda, ramkę tę można otworzyć na pełnym ekranie.
wysokość Piksele Określa wysokość osadzonej ramki iframe, a domyślna wysokość to 150 px.
nazwa tekst Nadaje nazwę elemencie iframe. Atrybut name jest ważny, jeśli chcesz utworzyć łącze w jednej ramce.
Brzeg ramki 1 lub 0 Określa, czy element iframe powinien mieć obramowanie, czy nie. (Nieobsługiwane w HTML5).
Szerokość Piksele Określa szerokość osadzonej ramki, a domyślna szerokość to 300 px.
źródło Adres URL Atrybut src służy do podania nazwy ścieżki lub pliku, którego zawartość ma zostać załadowana do elementu iframe.
piaskownica
Ten atrybut służy do zastosowania dodatkowych ograniczeń dotyczących zawartości ramki
formularze zezwalające Umożliwia przesłanie formularza, jeśli to słowo kluczowe nie zostanie użyte, przesłanie formularza zostanie zablokowane.
wyskakujące okienka Włączy wyskakujące okienka, a jeśli nie zostanie zastosowane, nie otworzy się żadne wyskakujące okienko.
zezwalaj na skrypty Umożliwi to uruchomienie skryptu.
zezwalaj na to samo pochodzenie Jeśli zostanie użyte to słowo kluczowe, osadzony zasób będzie traktowany jako pobrany z tego samego źródła.
źródłowy Atrybut srcdoc służy do wyświetlania zawartości HTML we wbudowanej ramce iframe. Zastępuje atrybut src (jeśli obsługuje to przeglądarka).
przewijanie
Wskazuje, że przeglądarka powinna udostępniać pasek przewijania dla elementu iframe, czy nie. (Nieobsługiwane w HTML5)
automatyczny Pasek przewijania pokazuje się tylko wtedy, gdy zawartość elementu iframe jest większa niż jego wymiary.
Tak Zawsze pokazuje pasek przewijania dla elementu iframe.
NIE Nigdy nie wyświetla paska przewijania dla elementu iframe.