从头开始学Web开发—CSS

CSS导入使用及引用的两种方法：

外部引用
1. 外部引用的方式，我们直接可以通过link标签来引用我们写好的一个CSS文件；
2. 在link 标签中，我们通过rel = "stylesheet"来告诉浏览器，这是一个样式文件，同时rel还有另一个取值 alternative，这样用户自己可以选择样式，当然这个前提是当前页面引入的css样式表文件不止一个。
3. 现在一般建议使用css文件外联引用，即把css样式单独作为一个.css文件。
直接使用
1. 可以style标签直接在html 文件中直接写，然后页面通过调用；
2. 在html文件中直接写样式表时，可以通过@import文件导入外部样式；
下面是样式引用的例子；

CssUse.html文件代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <link rel="stylesheet" type="text/css" href="direct.css">
    <title>CSS Use</title>
    <style type="text/css">
        @import url("http://localhost/cssUse/waysToImportCss.css");
        h2 { color: green; }
    </style>
</head>
<body>
    <h1>通过link连接的样式</h1>
    <p>通过link连接的样式</p>
    <h2>直接写的样式</h2>
    <a href="#">import导入的样式</a>
</body>
</html>

Direct.css文件代码：

h1 { color: blue; }

p { color: yellow; }

waysToImportCss.css文件代码：

a { padding: 0 5px;}

a:hover { color: lightblue; }

a:visited { color: yellow; }