在网页文件中调用CSS文件
CSS作为效率高、灵活性强而被广泛地应用于网页制作中。难得的是，CSS既可以以各种方式嵌入HTML文件中，也可以以文件的形式独立存在被而不同的HTML文件随时调用。本文将讨论CSS文件如何编写以及CSS文件如何被HTML网页文件调用。
以设置字体为例，我们现在来看看CSS文件是怎样编写的。
我们首先要用到HTML语法标签中的分区标识div和段落标识符p。这里我们使用div，使用p情况是一样的。其次，我们得掌握的语法标记，它并不复杂，看一下下面的例子就明白了：
div{color:red;font-size:11pt;font-family:宋体}
上例中，我们把字体设置为：颜色——红；大小——11个点阵；字体——宋体。这样，往后在HTML网页文件中凡包含在<div>
和</div>之间的文字，只要不另外作font设置，这些文字将以宋体显示，字体颜色为红，大小是11个点阵。
我们还可以从上面的例子中得知，CSS语法的编写要点是：
标记{内容1;内容2;内容3;……;内容n}
上例代码中，div即是一个“标记”，大括号里面的即是“内容”，“内容”里用小角冒号“:”隔开参数和参数值，而每一个“内容”之间用小角分号“;”隔
开，理论上，“内容”可以是任意多的，根据你的需要尽管设置好了。值得注意的是，“标记”我们也可以自定义，比
如：div.red，div.blue，p.red，p.blue，也可以把“.”前面的div和p去掉，简单记成.red，.blue。至于CSS语法
的其他相关知识，请参阅有关材料。
好了，我们可以编写CSS文件了。请在你的网页文件夹的根目录里建立一个名为css文件夹（注意用小写，有些空间不支持大写文件/文件夹名），这个文件夹
将存放我们将要编写的CSS文件。下面是一个完整的CSS文件清单，你可以用记事本编写，编写完后通过“另存为”把文件保存为
font_setting.css（你也可以保存为其他的名称，但后缀名一定是.css并在HTML文件中引用时使用正确的CSS文件名）。
.red { color:red;font-size:18pt;font-family:华文行楷 }
.blue {color:blue;font-size:26pt;font-family:华文彩云 }
.yellow { color:yellow;font-size:30pt;font-family:华文仿宋 }
.pink {color:pink;font-size:40pt;font-family:华文隶书 }
在以上CSS文件内容清单里，我们定义了四种字体设置：红、蓝、黄、粉红，每种颜色的字体和字体大小也不一样。你还可以根据需要设置更多的字体设置，记得所定义的“标记”前面一定得有小角符号“.”，如“.red”（red可用其他的名称）。
CSS文件编写好了，下面的工作就是如何在HTML文件中调用它来控制我们的字体了。现在我们在我们的网页文件夹的根目录下建立一个网页文件，文件名为test.html，它的内容清单如下：
<html>
<head>
<title>CSS测试</title>
<link rel=stylesheet href="css/font_setting.css" type="text/css">
</head>
<body>
<div class="red">css文件调用测试</div>
<div class="blue">css文件调用测试</div>
<div class="yellow">css文件调用测试</div>
<div class="pink">css文件调用测试</div>
<div>css文件调用测试</div>
</body>
</html>
上面的网页代码要点分析：
一、用<link>连接CSS文件。
<link>语句放在<head>和<head>之间，上述HTML代码中，以下这句就是连接CSS语法式样：
<link rel=stylesheet href="css/font_setting.css" type="text/css">
这里，<link>语句中，属性rel和type值总是固定的，href则指明CSS文件所在目录，我们应该根据事先编好的CSS文件所在目录来指定，可以是相对路径，也可以是绝对路径。
二、用class属性具体定义字体。
在HTML代码中，正文内容总是放在<body>和</body>之间。请观察上面HTML代码中的调用方式，你会发现，
在<div>语句里，前四句都有“class="…"”字样（等号后面的小角双引号可要可不要），class就是用来指定标记属于何种样式的
类别。第五句我们没有加入class属性，意在让大家比较一下使用和不使用class属性的效果。
现在你可以打开test.html文件查看效果了。在浏览器里，如果效果正如你所设置的那样，那么，请让黑马恭喜你！如果不是，不要担心，一定有什么错误
了，如引用CSS文件的路径名和文件名错误、代码有问题等，请再阅读一遍本文，然后再修改你的代码，你会成功的。
在本地机运行成功后，你就可以上传你的CSS文件和网页文件了。一定要注意：在服务器里，CSS文件和网页文件所在的目录应该与在本地磁盘所在的目录是相一致的。
分享到：
相关推荐
嵌入视频和音频 调用网页多媒体文件;调用网页中的音频;用法示例;用法示例;用法示例;调用网页中的视频文件;用法示例;用法示例;总结;;小任务 ;THANKS
当项目js（css）文件使用越来越多，js 文件的加载也成了性能上的一个问题，此资源能够在页面全部加载完成后异步加载js等资源文件，它可以顺序加载资源列表，也可以并发加载资源列表，它包含一个方法调用接口：...
unigui_调用外部js与cssunigui_调用外部js与cssunigui_调用外部js与css
如果需要在 CSS 文件中添加额外的样式信息，那么使用 @import 更加合适，因为 @import 是 CSS 的一个标签，可以直接在 CSS 文件中使用。 五、总结 link 和 @import 都可以用来引用外部的样式文件，但它们的应用...
把微信中获取的表情标签如：<span class="emoji emoji1f631"></span>，直接输出到HTML中，再引入本CSS文件即可识别显示。
ASP.NET根据屏幕分辨率调用不同css文件
javascript访问外部css文件的所有方法总结，希望对大家有所帮助
1、动态加载js，css文件(用原生js和jquery) iframe结构： frame0(父) frame2（子） frame3（子） frame2中触发事件，动态的向frame3中 加载js、css文件和 dom元素？ *同级之间可以调用，可以 通过 子-父-子 的方式...
全部定义好后，再用记事本创建一个空的 CSS 外连式文件，把在〈head〉与〈/head〉之间的那段定义好的 CSS 复制到 CSS 文件中去。 3. 让背景图案静止不动 使用 CSS 可以实现背景图象静止不动的效果。我们只要把下面...
样式可以是字符串，也可以是通过AJAX获取的字符串。 里面有调用例子。 可以动态的向网页中添加样式。无需通过文件调用
判断浏览器类型屏幕分辨率自动调用不同CSS的代码 打开后复制到HTML文件里运行.
可以将多个小图片整合成一张图片，并生成相应的CSS调用代码。CSS Sprites 样式生成工具也很不错，但是它只对一整幅图片进行操作的。而我们草根基本上很少有人自己去设计一套图标或UI，一般都是通过网站上收集的。...
使用函数read_css和write_css来简化对css文件的操作
JS判断浏览器分辨率自动调用不同CSS!
外部样式表是将css代码写入到一个独立的文件中，并通过link标签将其链接到jsp页面中。这种方法的优点是可以将样式统一管理，修改样式只需要修改该文件，所有链接到该文件的jsp页面将自动更新。其缺点是需要额外的...
ASP.NET根据屏幕分辨率的不同调用不同的css文件，用几句判断就可实现，具体请参见源码。
1) 源码本身很小,但是携带者一个用于...一种是返回一个数组的(例如 css表达式,获取的结果就是一个数组,哪怕只有一个成员)。所以这就解释了为啥会有两个类,那个dom数组类,就是对返回的结果集的封装,。@菜鸟菜鸡秋水。
打开从网上下载保存的Css样式文件，按照程序第一、二、三、四步进行处理，Css文件中的图片会被保存下来，默认保存路径是Css文件所在目录，并自动修改Css文件中原图片路径地址为相对地址，修改前会自动备份原文件。...
* 名字空间在网页设计中的应用 + 在网页设计中，名字空间可以用来区分不同的标记语言，例如 HTML 和 XML。 Day 3: 定义语言编码 * 什么是语言编码？ + 语言编码（Character Encoding）是用于指定网页内容的语言...