Heim  >  Artikel  >  Web-Frontend  >  Welche Möglichkeiten gibt es, CSS in HTML zu verwenden?

Welche Möglichkeiten gibt es, CSS in HTML zu verwenden?

青灯夜游
青灯夜游Original
2021-05-06 16:01:3535037Durchsuche

Es gibt 4 Möglichkeiten, CSS in HTML zu verwenden: 1. Verwenden Sie das Style-Attribut im HTML-Tag, um den CSS-Stil festzulegen. 2. Verwenden Sie das Style-Tag im Head-Tag, um den CSS-Stil festzulegen um eine externe CSS-Datei zu importieren ;4. Verwenden Sie die „@import“-Regel, um externe CSS-Dateien zu importieren.

Welche Möglichkeiten gibt es, CSS in HTML zu verwenden?

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Es gibt 4 Möglichkeiten, CSS in HTML zu verwenden:

  • Inline-Methode (Inline-Stil)

  • Interne Methode (Inline-Stil)

  • Link-Tag verwenden (Link-Stil)

  • Verwenden Sie @import (Import)

1. Inline-Modus (Inline-Stil)

Verwenden Sie das Style-Attribut im HTML-Tag, um den CSS-Stil festzulegen.

Format:

<html标签 style="属性:值;属性:值;....">被修饰的内容</html标签>

Beispiel:

<p style="color:orange;font-size:18px">在HTML中如何使用css样式</p>

Funktionen: Wirkt nur darauf Etikett.

2. Interne Methode (eingebetteter Stil)

ist die Verwendung des Style-Tags im Head-Tag, um den CSS-Stil festzulegen.

Format:

<style type="text/css"> ....css样式代码 </style>

Funktionen: Wirkt auf die gesamte aktuelle Seite das Link-Tag (Link-Typ)

Schreiben Sie den CSS-Code in eine separate Datei und verwenden Sie das Link-Tag, um die Datei direkt in die Seite einzuführen. Eine Seite kann das LINK-Tag mehrmals verwenden, um mehrere externe CSS-Dateien einzuführen. Achten Sie auf die gegenseitige Beeinflussung dieser CSS-Codes. Normalerweise überschreiben die später eingeführten CSS-Dateien die gleichen Effekte wie die zuvor eingeführten CSS-Dateien. Diese Methode zur Einführung von CSS ist derzeit die beliebteste. CSS-Codes können im Rahmen jeder Website geplant werden, um die Wiederverwendung und Wartung zu erleichtern. Dadurch wird der Code jedoch stark zentralisiert, und die Codemenge ist möglicherweise zu groß Es kann zu Verwirrung kommen, wenn es nicht ordnungsgemäß gepflegt wird.

<link rel="stylesheet" type="text/css" href="style.css">

4. Verwenden Sie @import (importieren)

Es gibt zwei Möglichkeiten, CSS-Dateien in c9ccee2e6ea535a969eb3f532ad9fe89...531ac245ce3e4fe3d50054a55f265927 einzufügen Wie folgt:

@import url(index2.css);

Darüber hinaus kann es auch in einer CSS-Datei verwendet werden. Die Verwendung ist wie folgt:

@import "sub.css";

Durch die Verwendung von @import zum Einführen von CSS kann der CSS-Code externer Dateien einfach eingeführt werden, was die Wartung und Planung erleichtert. Allerdings wird jedes Mal, wenn eine zusätzliche CSS-Datei eingeführt wird, eine Verbindungsanforderung an den Server hinzugefügt. Wenn die Anzahl der Besuche groß ist, muss ein Kompromiss zwischen Wartbarkeit und Leistung geschlossen werden.

Empfohlenes Tutorial: „

HTML-Video-Tutorial

Das obige ist der detaillierte Inhalt vonWelche Möglichkeiten gibt es, CSS in HTML zu verwenden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn