Heim >Web-Frontend >HTML-Tutorial >Wie wende ich CSS auf iframe an?
Wie wende ich CSS auf iframe an?
- WBOYnach vorne
- 2023-08-27 09:53:021200Durchsuche
Verwenden Sie den HTML-Tag
Wir können CSS problemlos auf Iframes anwenden, aber schauen wir uns zunächst die Eigenschaften von
ansrc – Dieses Attribut wird verwendet, um den Dateinamen anzugeben, der in den Frame geladen werden soll. Sein Wert kann eine beliebige URL sein.
name – Mit dieser Eigenschaft können Sie einen Namen für den Frame angeben. Es wird verwendet, um anzugeben, in welchen Frame das Dokument geladen werden soll.
marginheight – Mit dieser Eigenschaft können Sie die Höhe des Abstands zwischen der Ober- und Unterseite des Rahmenrands und seines Inhalts angeben. Der Wert wird in Pixel angegeben.
height – Diese Eigenschaft gibt die Höhe von
scrolling – Diese Eigenschaft steuert das Erscheinungsbild der Bildlaufleisten, die im Rahmen angezeigt werden. Der Wert kann „ja“, „nein“ oder „auto“ sein.
longdesc – Mit diesem Attribut können Sie einen Link zu einer anderen Seite bereitstellen, der eine detaillierte Beschreibung des Frame-Inhalts enthält.
width – Diese Eigenschaft gibt die Breite von
Jetzt wenden wir CSS auf den Iframe an.
Inline-CSS auf Iframe anwenden
Das Style-Attribut wird zum Festlegen von Inline-CSS verwendet. Wir legen die Ränder, Breite und Höhe fest -
<iframe style="border: 2px solid gray; width: 500px; height: 400px;" src="https://www.tutorialspoint.com/market/index.asp" id="Ebooks">
Beispiel
Sehen wir uns ein Beispiel an -
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Courses</h1>
<iframe style="border: 2px solid gray;
width: 500px; height: 400px;" src="https://www.tutorialspoint.com/market/index.asp"
id="Ebooks">
</iframe>
</body>
</html>
Internes CSS auf Iframe anwenden
Dasstyle-Tag wird verwendet, um das interne CSS des Iframes festzulegen. Wir haben den iFrame mit neuen Rändern, Breiten und Höhen gestaltet -
iframe {
border: 3px solid green;
width: 500px;
height: 400px;
}
Beispiel
Sehen wir uns ein Beispiel an -
<!DOCTYPE html>
<html>
<head>
<style>
iframe {
border: 3px solid green;
width: 500px;
height: 400px;
}
</style>
</head>
<body>
<h1>Courses</h1>
<iframe src="https://www.tutorialspoint.com/market/index.asp" id="Ebooks">
</iframe>
</body>
</html>
Das obige ist der detaillierte Inhalt vonWie wende ich CSS auf iframe an?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!