本文介绍了CSS与HTML文档的四种结合方式：1) 内部样式表，将样式放在<head>标签内；2) 行内样式表，通过HTML标签的style属性定义样式；3) 链入外部样式表，使用<link>标签链接CSS文件；4) 导入外部样式表，利用@import在样式表文件中引入其他样式表。这些方法帮助实现页面的样式控制。
1.定义内部样式表
内部样式表就是把样式表放到页面<head>…</head>区内，这些定义的样式就应用到页面中了。
格式：
<style type=”text/css”>
<!--
选择符1{属性：属性值；属性：属性值；…}
选择符2{属性：属性值；属性：属性值；…}
选择符3{属性：属性值；属性：属性值；…}
…
-->
<!-- …-->的作用是避免旧版本浏览器不支持css，这样把<style>…</style>的内容以注释的方式表示，对于不支持css的浏览器就会跳过这段代码。
2.定义行内样式表
行内样式表也叫做内嵌样式表，是指在HTML标签中直接插入style属性，再定义要显示的样式表，而style的属性内容就是css的属性和值。
格式：
<标签 style=“属性：属性值；属性：属性值；…”>
3.链入外部样式表
链入外部样式表就是当浏览器读取到HTML文件的样式表链接标签时，将向链接所指向的外部样式表索取样式。具体操作是，先将样式表保存到一个样式表文件(.css)，然后再网页中用<link>标签链接这个样式表的文件
3.1用<link>标签链接样式表文件
格式：
<head>
…
<link rel=”stylesheet” href=”外部样式表文件名.css” type=”text/css”>
…
</head>
3.2样式表文件格式
格式：
选择符1{属性：属性名；属性：属性值；…}
选择符2{属性：属性名；属性：属性值；…}
选择符3{属性：属性名；属性：属性值；…}
4.导入外部样式表
<style type=”text/css”>
<!—
@import url(“外部样式表的文件名。css”)；
@import url(“外部样式表的文件名。css”)；
其他样式表的声明
-->
</style>
扫一扫
967
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
