Heim > Artikel > Web-Frontend > Was sind austauschbare Elemente? (mit Beispielen)
Der Inhalt dieses Artikels befasst sich mit der Frage, was austauschbare Elemente sind. (Mit Beispielen) hat es einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen.
Kürzlich habe ich versehentlich einen Freund in einem Gruppenchat gesehen, der einen Screenshot von Toutiaos Front-End-Interviewfragen gepostet hat. Es gab nur eine Frage zu HTML, und zwar wie folgt:
Was ist ein ersetzbares Element? ? und nicht austauschbare Elemente, was ist ihr Unterschied? und Beispiele nennen.
Die HTML-Fragen im Front-End-Interview sind am wenigsten und nicht schwierig. Es gibt nur wenige Fragen, die immer wieder wiederholt werden müssen. Wir haben bereits über die klassischste HTML-Semantik gesprochen, und heute nutzen wir diese Gelegenheit, um über ersetzbare Elemente zu sprechen.
Definition
Was ist ein austauschbares Element? Wie der Name schon sagt, ist es das Element, das ersetzt wird. (Ungeschicktes Lachen...
Zum Beispiel ein typisches austauschbares Element img:
<img src=xxx.jpg>
Wir haben keinen Inhalt in das img
-Tag geschrieben, woher kommt also der Inhalt? von Was ist mit
? Der Browser lädt das durch das src-Attribut angegebene Bild herunter und ersetzt das Tag img
durch die Bildressource Das Ersatzelement ist etwas Besonderes, seine Breite und Höhe werden durch seinen geladenen Inhalt bestimmt (natürlich kann CSS seinen Stil überschreiben)
Beispiel
Immer noch img
verwenden sind ein paar Beispiele für Tags:
<img src="https://avatars2.githubusercontent.com/u/17703242?s=460&v=4">
Wenn das Bild auf der Seite angezeigt wird, ist es die Breite und Höhe des Bildes selbst. Das
img
-Element unterstützt auch das width
und height
Attribute:
<img width="80" height="80" src="https://avatars2.githubusercontent.com/u/17703242?s=460&v=4">
Zu diesem Zeitpunkt wird das Element mit einer Breite und Höhe von 80 Pixeln angezeigt
Wenn wir CSS verwenden, um seinen Stil zu überschreiben:
img { width: 60px; height: 60px; }
Das Element wird wie folgt angezeigt:
Definition von MDN
Nachdem wir die obigen Beispiele gesehen haben, wird es für uns einfacher um das konzeptionelle Wissen zu verstehen. >Der Präsentationseffekt von
ersetztem Element
ersetztes Element) wird nicht von CSS gesteuert. Diese Elemente sind externe Objekte und die Darstellung ihres Aussehens ist unabhängig davon CSS. Einfach ausgedrückt: Ihr Inhalt wird nicht vom Stil des aktuellen Dokuments beeinflusst. CSS kann die Position ersetzbarer Elemente beeinflussen, nicht jedoch den Inhalt der ersetzbaren Elemente selbst.Typisch . Zu den austauschbaren Elementen gehören
<iframe>
, und einige Elemente werden nur unter bestimmten Umständen als austauschbare Elemente behandelt, z. B. <video>
<embed>
[Verwandte Empfehlungen: <img>
HTML-Video-Tutorial<input>
】
Das obige ist der detaillierte Inhalt vonWas sind austauschbare Elemente? (mit Beispielen). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!