小蔡学Web:[10]web样式调用
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后缀格式的样式文件,用来做外部调用的文件。保存为style.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>标签里面输入调用外部CSS样式的语句如下:<hea蟠校盯昂d><tit造婷用痃le>CSS调用</title><link rel="stylesheet" href="style.css" type="text/css" /></head>用的是<link>标签rel是关联的意思,关联的是一个样式表(stylesheet)文档,herf是一个链接,type是调用的文件类型。结果如下: