问题:

在HTML中引入css的其中的两个方法:

   导入式和链接式的目的都是将一个独立的css文件引入一个文件中,二者的区别不大,事实上,二者最大的区别在于链接式使用html的标记引入外部css文件,而使用导入式则是使用css规则引入外部css文件。因此它们的语法也不同。

1.如果使用链接式,需要使用如下的语句引入外部css文件:

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

2.如果使用导入式,则需要使用如下语句:

<style
type="text/css">
@import "style.css"
</style>


````此外,采用这两种方式后的现实效果也略有区别。使用链接式时,会在装载页面主体部分
之前装载css文件,这样现实出来的页面从一开始就是带有样式效果的,而使用导入式时,会在整个页面装载完成之后再装载css文件,对于有的浏览器来说,
在一些情况下,如果页面文件的体积比较大,则会出现先现实无样式的页面,闪烁一下之后再出现设置样式的效果。从浏览者的感受来说,这是使用导入式的一个缺
陷。

````对于一个较大的网站,为了便于维护,可能会希望把所有的css样式分别放在几个
css文件中,这样如果使用链接式引入,就需要几个语句分别导入css文件。如果要调整css文件的分类,就需要同时调整html文件。这对于维护工作来
说,是一个缺陷。如果使用导入式,则可以只引进一个总的css文件,在这个文件中再导入其他独立的css文件;而链接式则不具备这个特征。

````因此这里给大家的建议是,如果仅引入一个css文件,则使用链接方式;如果需要引入多个css文件,则首先用链接式引入一个“目录”css文件,这个“目录”css文件中再使用导入式引入其他css文件。

````但是如果希望通过JavaScript来动态决定引入哪个css文件,则必须使用链接方式才能实现。

如何将多个CSS文件导入到一个CSS文件中?

答案:

你可以写了三个css样式表
css_red.css  , 
css_blue.css  , css_green.css
这样你就可以写一个主样式   
style.css  把三个样式表都装进去:
@import "css_red.css"; 
@import "css_blue.css";
@import "css_green.css";

调用的时候只调用   
style.css  就行了。

具体代码:

<html
xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;
charset=utf-8" />
<title>字体属性</title>

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

<body>
<p
class="red">红色</p>

<p
class="blue">蓝色</p>

<p
class="green">绿色</p>

</body>
</html>

style.css

@charset "utf-8";

@import "css_red.css";
@import "
css_blue.css";
@import "
css_green.css";

css_red.css

@charset "utf-8";

.red {
color:red;
}

css_blue.css

@charset "utf-8";

.blue{
color:blue;
}

css_green.css

@charset "utf-8";

.green{
color:green;
}

实际页面效果:

怎样将多个CSS文件导入一个CSS文件中的更多相关文章

  1. 如何将dmp文件导入到oracle数据库中

    如何将dmp文件导入到oracle数据库中 1.首先,我们可以先建立自己的一个用户表空间,创建表空间的格式如下: CREATE TABLESPACE certification(表空间的名字) DAT ...

  2. 使用SQL语句创建数据库1——创建一个数据库文件和一个日志文件的数据库

    目的:创建一个数据库文件和一个日志文件的数据库 在matser数据库下新建查询,输入的命令如下: USE master——指向当前使用的数据库.创建数据库实际上是向master数据库中增加一条数据库信 ...

  3. thinkphp 使每一个模板页都包括一个header文件和一个footer文件

    在开发的过程中,常常遇到要使每一个模板页都包括一个header文件和一个footer文件.thinkPHP的模板布局为我们提供了一个叫全局配置方式可以解决问题. 1. 在配置文件里开启LAYOUT_O ...

  4. 将CSV格式或者EXCEL格式的文件导入到HIVE数据仓库中

    学习内容:数据导入,要求将CSV格式或者EXCEL格式的文件导入到HIVE数据仓库中: ①hive建表:test1 create table test1 (InvoiceNo String, Stoc ...

  5. Navicate for mysql如何导入一个sql文件

    我在做的项目是宜立方商城的项目,现在需要把见表的sql文件导入到navicate中去,步骤如下: ①新建一个数据库,如下: ②在数据库名字上右键,选择运行sql文件 ③选择如下sql文件 ④刷新之后:

  6. .m文件导入C++头文件带来的错误

    这几天的工作挖了不少的坑.遇到了各种千奇百怪的错误,如今好好总结一下. 新建一个project,然后新建HelloCPP.h,HelloCPP.cpp文件.HelloCPP.h文件内容例如以下: #i ...

  7. 使用pyinstaller打包多个py文件为一个EXE文件

    1. 安装pyinstaller. pip install pyinstaller !!!!64位win7上打包后始终不能用,提示找不到ldap模块,换了32位win7就好了.!!!!(代码中涉及ld ...

  8. 使用ILMerge将所有引用的DLL和exe文件打成一个exe文件

    今天做了一个IM自动更新的软件,里面牵扯到了文件的解压和接口签名加密,使用了2个第三方的dll,想发布的时候才发现调用的类没几个,就像把它们都跟EXE文件打包在一起,以后复制去别的地方用也方便,于是上 ...

  9. windows 批处理把所有java源码导入一个txt文件中

    首先在src下搜*.java,把搜到的文件全拷出来放在allsrc目录下, 然后在allsrc目录下建个run.bat,键入以下内容for %%i in (*.java)  do type %%i&g ...

随机推荐

  1. SAS实验室之PROC TRANSPOSE

    首先,抛开SAS,回忆我们在数学课本上学习的转置是什么概念,转置如下图: 以上就是数学中的转置. 那么在SAS里该如何转置呢? 先看语法格式: PROC TRANSPOSE <DATA=inpu ...

  2. [Leetcode][JAVA] Insert Interval

    Given a set of non-overlapping intervals, insert a new interval into the intervals (merge if necessa ...

  3. form表单回车提交

    当form中只有一个input[type="text"](其他的表单元素可以随意有)的输入框时候,当input[type="text"]获得焦点的时候,无论表单 ...

  4. 如何安装win10+Red Hat Enterprise Linux双系统?

    1,如何安装win10+Red Hat Enterprise Linux双系统???? 有很多人(没做过调查,可能就我自己想装吧)想要安装Red Hat Enterprise Linux系统,但是又不 ...

  5. ASP.Net MVC跳转,分为form的submit提交跳转和ajax跳转

    1,用jquery ajax跳转的话,需要在前台用window.location("跳转网址")来跳转,在success后使用 2,用原声的form的submit来跳转,如下图 3 ...

  6. mono for android 各版本下载地址

    window下 在XamarinStudio 检查更新,会在这个目录下生成LOG和下载文件,所以可以从里面复制出来,查看真实下载地址 C:\Users\用户名\AppData\Local\Xamari ...

  7. 插入排序-java

    排序-插入排序 基本思想:将待排序表看作左右两部分,其中左边为有序区,右边为无序区, 整个排序过程就是将右边无序区中的元素逐个插入到左边的有序区中,以构成新的有序区. 平均时间:O(n2) 最好情况: ...

  8. css布局模型

    ---恢复内容开始--- 在清楚了CSS盒模型的基本概念,盒模型类型,我们就可以深入探讨网页布局的基本模型了.布局模型与盒模型一样都是CSS最基本,最核心的概念.但布局模型是建立在盒型基础之上,又不同 ...

  9. 【Win10 UWP】URI Scheme(一):Windows Store协议的解析和使用

    协议是Windows Phone和Windows Store应用的一个重要特点,可以做到在不同应用之间进行互相呼起调用.小小协议,学问大着呢.我打算写几篇关于协议在UWP中使用的文章. 这一讲的主要对 ...

  10. C#/net 使用Protocol Buffers入门

    Protocol buffers 是一个由谷歌开发的开源的编码机制用于将结构化的数据序列化或者反序列化,被设计成语言以及平台中立,protobuff比xml更简单比json还要紧凑一些,网上有一些关于 ...