网页添加样式表的方法

 
1 .最简单的方法是直接添加在HTML的标识符(tag)里:
<Tag style=”properties”> 网页内容</tag>
举个例子:
<p style=”color: blue; font-size: 10pt”>CSS 实例</p>
代码说明:
用蓝色显示字体大小为10pt的“CSS实例”。尽管使用简单、显示直观,但是这种方法不怎么常用,因为这样添加无法完全发挥样式表的优势“内容结构和格式控制分别保存”。
2 .添加在HTML的头信息标识符<head>里:
<head>
<style type=”text/css”>
<!--
样式表的具体内容
-->
</style>
</head>
type=”text/css” 表示样式表采用MIME类型,帮助不支持CSS的浏览器过滤掉CSS代码,避免在浏览器面前直接以源代码的方式显示我们设置的样式表。但为了保证上述情况一定不要发生,还是有必要在样式表里加上注释标识符“<!--注释内容-->”。
3 .链接样式表
同样是添加在HTML的头信息标识符<head>里:
<head>
<link rel=”stylesheet” href=”*.css” type=”text/css” media=”screen”>
</head>
*.css 是单独保存的样式表文件,其中不能包含<style>标识符,并且只能以css为后缀。
Media 是可选的属性,表示使用样式表的网页将用什么媒体输出。取值范围:
·Screen (默认):输出到电脑屏幕
·Print :输出到打印机
·TV :输出到电视机
·Projection :输出到投影仪
·Aural :输出到扬声器
·Braille :输出到凸字触觉感知设备
·Tty :输出到电传打字机
·All :输出到以上所有设备
如果要输出到多种媒体,可以用逗号分隔取值表。
Rel 属性表示样式表将以何种方式与HTML文档结合。取值范围:
·Stylesheet :指定一个外部的样式表
·Alternate stylesheet :指定使用一个交互样式表
4 .联合使用样式表
同样是添加在HTML的头信息标识符<head>里:
<head>
<style type=”text/css”>
<!--
@import “*.css”
其他样式表的声明
-->
</style>
</head>
以@import开头的联合样式表输入方法和链接样式表的方法很相似,但联合样式表输入方式更有优势。因为联合法可以在链接外部样式表的同时,针对该网页的具体情况,做出别的网页不需要的样式规则。
需要注意的是:
· 联合法输入样式表必须以@import开头。
· 如果同时输入多个样式表有冲突的时候,将按照第一个输入的样式表对网页排版。
· 如果输入的样式表和网页里的样式规则冲突时,使用外部的样式表
 
  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值