css样式的三种方法及选择器
2018-10-27 本文已影响0人
我叫zhengxianjun
css样式三种方法
- 第一种：内联样式
<p style=" 属性：值；属性：值；... "></p>
- 第二种：外联样式
<link rel="stylesheet" href="url">
- 第三种：内部样式，选择器
<html>
<head>
<meta charset="UTF-8">
<title>css样式三种方法</title>
<link rel="stylesheet" href="K:/eidtplus/外联选择器.css">
<style type="text/css">
#pc,#p1,#hh5{
color:blue;
border:1px solid red;
}
.pp{
color:black;
}
p{
color:red;
}
[align="center"]{
color:pink;
}
</style>
</head>
<body>
<p id="pp" class="c">
id选择器：#pp{属性：值} [align="center"]{} .c{} p{}
</p>
</body>
</html>
- （在同一个文件下，没有外联样式）这三个选择器的优先级是：
标签选择器《class选择器《属性选择器《id选择器《内联样式 - （不在同一个文件下，有外联样式）
当标签内部 有style内联样式时，外联样式小于内联样式，无论外联样式的选择器为何等级。
当标签内没有style内联样式时，首先进行外联样式的选择器和内部选择器样式进行选择器比较，当等级一样时内部选择器样式等级高。
四种选择器：（优先级从高到低）
- id选择器
- 属性选择器
- class选择器（类选择器）
- 标签选择器
今天心情很不好，暂且就回顾到这里吧。我相信，付出总会有回报的。
夜深人静。
