css:页面美化和布局控制
一、概念:Cascading Style Sheets 层叠样式表,多个样式可以作用在一个html的元素上,同时生效
二、好处
1.相比于html的标签属性功能更全更强大
2.将内容展示与样式控制分离
*降低耦合度
*让分工协作更容易
*提高开发效率
三、css的使用
1.内联样式
*在标签内使用style属性指定css代码
2.内部样式
*在head标签内定义 style标签,style的标签体内容就是css代码
3.外部样式
*定义css资源文件
*在head标签内定义link标签,引入css资源文件
注意:3种方式,作用域越来越大,内联常用,内部和外部常用
<!DOCTYPE html>
<html lang=ch>
<head>
<style type="text/css">
/* 2.内部样式:在head标签内定义 style标签,style的标签体内容就是css代码 */
#nb {
color: green;
}
</style>
<!-- 3.外部样式 *定义css资源文件 *在head标签内定义link标签,引入css资源文件 -->
<link rel="stylesheet" href="css/style.css">
<title>css结合html.html</title>
</head>
<body>
<div style="color: red">1.内联样式 在标签内使用style属性指定css代码</div>
<div id="nb">2.内部样式:在head标签内定义 style标签,style的标签体内容就是css代码</div>
<div id="wb">3.外部样式:在head标签内定义link标签,引入css资源文件</div>
</body>
</html>
style.css
#wb {
color: blue
}
四、css基本语法
1.格式
选择器{