<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>css学习</title>
<style>
#idchoose{color: aqua;}
.classchoose{color: firebrick; text-align: center;}
body{background-color: royalblue ;
background-image: url('OIP-C.jfif');
background-repeat: no-repeat;
background-position:center;
}
p{background-color: aliceblue;}
h5{text-align: left;color: orangered;}
</style>
</head>
<body>
<p>css 层叠样式表</p>
<h5>样式定义如何显示HTML元素</h5>
<h5>样式通常储存在样式表中</h5>
<h5>样式表可以解决内容与表现分离的问题</h5>
<h5>外部样式表可以极大的提高工作效率</h5>
<h5>外部样式表通常储存在CSS文件中,多个样式定义可层叠为一个</h5>
<h5>规则由两个主要的部分构成:选择器以及一条或多条声明:</h5>
<h4> 选择器 {属性:属性值;属性:属性值;}</h4>
<h4 id="idchoose"> 选择器:id 选择器 #id值 {属性:属性值;}</h4>
<h4 class="classchoose"> 选择器:class 选择器 --类选择器 .class值{属性:属性值;}</h4>
</h5>/*css注释 */</h5>
<p>插入样式表的三种方式:</p>
<ul>
<li>外部样式表 在HTML头部利用link标签链接css样式文件 适合多页面</li>
<li>内部样式表 单个文档需要特殊样式时,可以使用内部样式表 在HTML头部使用style标签定义内部样式表</li>
<li>内联样式 单个标签内使用 style属性</li>
</ul>
<p>多重样式优先级:内联样式>内部样式>外部样式>浏览器默认样式 *外部样式放在内部样式后面则外部样式将覆盖内部样式</p>
</body>
</html>
相关文章
- 10-11CSSXUEXI