css:cascading style sheet 层叠样式表
作用: 设置网页的显示效果(样式),解决html代码对样式定义的重复,提高了后期代码的可维护性
将显示效果和内容分开。(耦合性:模块间关系)
如果开发了多套css代码,不用修改html
css与html结合方式:
1.在html的标签上,提供一个属性,style=“CSS代码”
<div style="color: red;">
测试内容
</div>
2.在Html文件,提供了一个标签 <style type="text"/css>css代码</style>,这个标签放在<head></head>中间
<style>
div{
color: red;
}
</style>
3.引入外部的文件的方式(在head中引入css文件)属性必须要写在<style></style>中
<style>
@import url("div.css");
@import url("span.css");
@import url("p.css");
</style>
可以改为这样:
<style>
@import url("total.css");
</style>
total文件:
@import url("div.css");
@import url("span.css");
@import url("p.css");
4.引入外部文件的方式,通过放在head中间
<link rel="stylesheet" href="test.css">
属性:
rel:代表当前和引入文件的关系
type:
href:引入文件地址