Heim >Web-Frontend >CSS-Tutorial >Was bedeutet @import in CSS?
In CSS dient @import zum Importieren von CSS-Stylesheets. Diese Methode wird normalerweise in CSS-Dateien verwendet. Der Vorteil besteht darin, dass mehrere Stylesheets in ein Stylesheet importiert werden können, sodass die Seite nur für Sie geeignet ist Sie müssen ein Stylesheet importieren.
Video-Tutorial-Empfehlung: „CSS-Video-Tutorial – Jade Girl Heart Sutra Edition“
Eingeführt Es gibt zwei CSS-Methoden, eine ist @import und die andere ist link
@import url('地址');
<link href="地址" rel="stylesheet" type="text/css" />
Die meisten Websites verwenden jetzt die letztere Link-Methode, weil
@import zuerst HTML lädt und dann CSS lädt
Link lädt zuerst CSS, dann HTML.
Die erstere Lade-Webseite erscheint also in einem Format, das dem Betrachter unbekannt ist, während die letztere die Webseite mit Formatierung lädt.
Mehrere Möglichkeiten, @import einzuführen
@import wird standardmäßig eingeführt, um im Less-Modus, außerhalb von CSS, zu lesen:
@import "foo"; // foo.less 导入为less文件 @import "foo.less"; // foo.less 导入为less文件 @import "foo.php"; // foo.php 导入为less文件 @import "foo.css"; // 语句保持原样,导入为css文件
属性 | 作用 | 释义 |
---|---|---|
reference | 使用该less文件但是不输出它 | 使用@import (reference) 导入外部文件,导入的样式不会添加到编译输出,除非该样式被引用。 |
inline | 包括在源文件中输出,但是不作处理 | 当一个css文件可能无法被less所兼容时 |
less | 将该文件视为less文件,无论扩展名是什么 | |
css | 将文件视为css文件,无论扩展名是什么 | |
once | 该文件仅可导入一次 (默认) | 文件只会被导入一次,后续的导入相同文件的语句会被忽略。 |
multiple | 该文件可以多次导入 | 文件重复被引入多次 |
optional | 当没有发现文件时仍然编译 | 避免导入不存在的less文件,如果没有这个参数会报 File Error 错误 |
Empfohlenes Tutorial: „CSS-Tutorial“
Das obige ist der detaillierte Inhalt vonWas bedeutet @import in CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!