小蔡学Web：[10]web样式调用

2024-10-25 07:40:02

1、首先我们打开DW网页编辑器然后新建一个CSS调用.html文件。

2、然后随意写个标签，和写个网页内部的样式，我们已上次的网页布局为例。<st鲻戟缒男yle type="text/css">#top{ height:800px; width:200px; background-color:#CC0000; float:left;}#middle{ height:800px; width:500px; background-color:#FF9900;float:left;}#foot{ height:800px; width:200px; background-color:#FFFF00; float:left;}</style><body><div id="top"></div><div id="middle"></div><div id="foot"></div></body>这个代码的调试结果如下。

3、我们新建一个CSS后缀格式的样式文件，用来做外部调用的文件。保存为ｓｔｙｌｅ.css

4、然后我把上面<style>里面的内容剪切到style.css文件内。并且在原来的CSS调用.html文件内删掉style标签。

5、我们现在看一下失去样式之后的网页是怎么样的，调试如下代码：<title>CSS调用</title></head><body><div id="top"></div><div id="middle"></div><div id="foot"></div></body>

6、在<head>标签里面输入调用外部ＣＳＳ样式的语句如下：<hea蟠校盯昂d><tit造婷用痃le>CSS调用</title><link rel="stylesheet" href="style.css" type="text/css" /></head>用的是<link>标签rel是关联的意思,关联的是一个样式表(stylesheet)文档，herf是一个链接，type是调用的文件类型。结果如下：