css样式
css概念及css与html的3种结合方式
css:页面美化和布局控制
1.概念:Cascading Style Sheets 层叠样式表
*层叠:多个样式可以作用在同一个html的元素上,同时生效
2.好处:
1.功能强大
2.将内容的展示和样式控制分离
*解耦,降低耦合度
*让分工协作更容易
*提高开发的效率
3.css的使用:css与html的结合方式
1.内联样式
*在标签内使用style时序指定css代码
如:<div style="color:red;">hello
css</div>
*只能作用在当前标签
*不推荐使用,没有达到内容和样式分离的目的
2.内部样式
*在head标签内,定义style标签,style标签的内容写css代码
如:<style type="text/css">
div{
color: blue;
}
</style>
<div>hello css</div>
*只能作用在当前页面
3.外部样式
1.定义css资源文件
2.在head标签中定义link标签引入外部的资源文件
如:
<link rel="stylesheet" type="text/css" href="./css/3.css.css"/>
<div>hello css</div>
<!-- 引入外部资源的另一种方式 -->
<style >
@import url("css/3.css.css");
</style>
*可以作用于当前项目下所有引入css资源文件的html页面
*注意:
*1,2,3种方式 css的作用范围越来越大
*1方式不常用