三种基本选择器
作用:选择界面上的某一个或者某一类元素
基本选择器
标签选择器
标签选择器会选择到页面上所有的这个标签的元素
h1{
color: #225378;
background: #b4a53b;
border-radius: 30px;
}
h1为标签
类选择器 class
选择所有class属性一致的标签,跨标签
同一个标签,但是颜色不同,则不能用标签选择器。在标签内定义class,并在style中分别用类选择器定义颜色
好处:可以多个标签归类,是同一个class,可以复用。例如标题1和4
类选择器的格式:
.类名{
}
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
.c1{
color: #225378;
}
.c2{
color: #360505;
}
.c3{
color: aqua;
}
</style>
</head>
<body>
<h1 class="c1">标题1</h1>
<h1 class="c2">标题2</h1>
<h1 class="c3">标题3</h1>
<h1 class="c1">标题4</h1>
</body>
id选择器
格式:#+id名称{}
id必须保证全局唯一
<style>
#i1{
color: #225378;
}
</style>
</head>
<body>
<p>
<li id="i1">1</li>
<li>2</li>
<li>3</li>
</p>
优先级
不遵循就近原则,固定的
id选择器>class选择器>标签选择器