<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> 类选择器 </title>
<style type="text/css">
/*基本语法
.类选择器名称{
css属性:属性值;
}
补充:选择器名称命名规范:小写字母 .xxx-yyy{}
*/
.span-news{
font-weight:bold;/*粗体*/
background-color:pink;
color:black;
}
/*基本语法
#id选择器名称{
css属性:属性值;
}
*/
#span-news-tb{
font-weight:bold;
font-size:25px;/*字体大小*/
background-color:pink;
}
</style>
</head>
<body>
<span class="span-news">标题一</span>
<span class="span-news">标题一</span>
<span class="span-news">标题一</span>
<span class="span-news">标题一</span>
<span class="span-news">标题一</span>
<hr>
<span id="span-news-tb">这是一个冬天</span>
</body>
</html>
细节:1.一般来说id选择器提供给某一个html元素来使用
2.当我们不确定,有多个html元素来使用该样式时,使用类选择器
网友评论