CSS学习笔记-导入CSS的几种方法(三)

使用style元素定义内部样式表——内嵌式

内部样式表通过<style>元素直接在HTML文档中定义样式表。
<style></style>标记对可以出现在HTML文档中的任意地方,一般情况下,在<head></head>标记对之间定义<style></style>
通过<style>定义的内部样式表只能应用于当前HTML文档中的元素。

<html>
<head>
<style type=“text/css”>
    table{ border:1px solid #cccccc; }
</style>
</head>

外部级联样式表——外联式

如果多个HTML文件需要共享样式表,应使用外部级联样式表。
将包含规则的样式表保存为后缀为 .css 的文件,在<head>标记中通过<link>标记引入。
其中,rel属性定义当前文档与href属性中链接文档之间的系,属性值 stylesheet 表示链接文档为外部的一个样式表文件;type属性表示链接文件的MIME类型;href为要链接文件的地址,可以是相对路径,也可以是绝对路径。

<html>
<head>
<link rel=“stylesheet” type=“text/csshref=“css文件地址” />
</head>

在.css文件中,只包括各项规则,不出现标记对。
一个HTML文档中,可以根据需要链接任意个外部样式表文件。多个样式表文件中的规则将根据被链接的顺序进行叠加与覆盖。

行内样式——style属性

每个HTML元素均有一个style属性,该属性值为当前元素直接定义样式,该样式只应用到当前的元素及其包含的内层元素。
Style属性的值与样式表规则{}内的内容相同。

<h1 style=“height:30px;line-height:30px”>一级标题内容</h1>

导入外部样式表

导入样式表是指在<style></style>标记内引用外部样式表文件的内容,也可以在中CSS文件中使用。导入通过@import语句实现。
使用时,@import语句必须出现在其他规则定义之前。
语法:@import url(样式表地址);
区别:<link>元素是HTML的一个标签,而@import是CSS的一个标签,是CSS的一部分,只能在CSS内部使用。

<style type=“text/css”>
@import url(css/main.css);
p{color:#444444;}
</style>
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值