是否可以在另一个CSS文件中包含一个？

#1楼

是的，可以使用@import并提供css文件的路径，例如

@import url("mycssfile.css");

要么

@import "mycssfile.css";

#2楼

是：

@import url("base.css");

注意：

@import规则必须在所有其他规则之前（ @charset除外）。
额外的@import语句需要额外的服务器请求。作为替代方案，将所有CSS连接到一个文件中以避免多个HTTP请求。例如，将base.css和special.css的内容复制到base-special.css并仅引用base-special.css 。

#3楼

CSS @import规则就是这样做的。例如，

@import url('/css/common.css');
@import url('/css/colors.css');

#4楼

在某些情况下，可以使用@import“file.css”，并且大多数现代浏览器都应该支持这一点，NN4等旧版浏览器会稍微坚固一些。

注意：import语句必须位于文件中的所有其他声明之前，并在生产中使用之前在所有目标浏览器上对其进行测试。

#5楼

是的，使用@import

http://webdesign.about.com/od/beginningcss/f/css_import_link.htm上的详细信息很容易google，一个很好的信息

#6楼

是。

@import "your.css";

这里记录了规则。

#7楼

是。可以将CSS文件导入另一个CSS文件。

它必须是使用@import规则的样式表中的第一个规则。

@import "mystyle.css";
@import url("mystyle.css");

唯一需要注意的是旧的Web浏览器不支持它。事实上，这是隐藏旧浏览器CSS样式的CSS'hack'之一。

有关浏览器支持，请参阅此列表。

#8楼

@import url("base.css"); 工作正常但请记住，每个@import语句都是对服务器的新请求。这对您来说可能不是问题，但是当需要最佳性能时，您应该避免使用@import 。

#9楼

我偶然发现了这个，我只是想说请不要在CSS中使用@IMPORT !!!! import语句被发送到客户端，客户端执行另一个请求。如果要在各种文件之间划分CSS，请使用Less。在Less中，import语句在服务器上发生，并且输出被缓存，并且不会通过强制客户端建立另一个连接而造成性能损失。 Sass也是我探索过的另一种选择。坦率地说，如果你不使用Less或Sass那么你应该开始。 http://willseitz-code.blogspot.com/2013/01/using-less-to-manage-css-files.html

#10楼

在这里唱CSS @import规则

@import url('/css/header.css') screen;
@import url('/css/content.css') screen;
@import url('/css/sidebar.css') screen;
@import url('/css/print.css') print;

#11楼

“@import”规则可以调用多个样式文件。这些文件在需要时由浏览器或用户代理调用，例如HTML标记调用CSS。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="EN" dir="ltr">
<head>
<title>Using @import</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
@import url("main.css");
</style>
</head>
<body>
</body>
</html>

CSS文件“main.css”包含以下语法：

@import url("fineprint.css") print;
@import url("bluish.css") projection, tv;
@import 'custom.css';
@import url("chrome://communicator/skin/");
@import "common.css" screen, projection;
@import url('landscape.css') screen and (orientation:landscape);

要在样式元素中插入，使用createTexNode不要使用innerHTML，但是：

<script>
var style = document.createElement('style');
style.setAttribute("type", "text/css");
var textNode = document.createTextNode("
    @import 'fineprint.css' print;
    @import 'bluish.css' projection, tv;
    @import 'custom.css';
    @import 'chrome://communicator/skin/';
    @import 'common.css' screen, projection;
    @import 'landscape.css' screen and (orientation:landscape);
");
style.appendChild(textNode);
</script>

#12楼

我创建了main.css文件，并在其中包含了所有css文件。

我们只能包含一个main.css文件

@import url('style.css');
@import url('platforms.css');

#13楼

是的您可以轻松地将一个CSS导入到另一个（网站中的任何位置）您必须使用如下：

@import url("url_path");

#14楼

@import url('style.css');

与最佳答案相反，建议不要在使用HTTP / 2.0时将所有CSS文件聚合到一个块中

#15楼

使用altervista和wordpress导入bootstrap

我使用它来在altervista中使用wordpress导入bootstrap.css

@import url("https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css");

它工作正常，因为它会删除html链接rel代码，如果我把它放入页面

#16楼

无论出于何种原因，@ import对我不起作用，但它不是真的有必要吗？

这是我在html中所做的事情：

  <link rel="stylesheet" media="print" href="myap-print.css">
  <link rel="stylesheet" media="print" href="myap-screen.css">
  <link rel="stylesheet" media="screen" href="myap-screen.css">

请注意，media =“print”有两个样式表：myap-print.css和myap-screen.css。这与在myap-print.css中包含myap-screen.css的效果相同。