CSS核心(二)基本选择器 id 标签 class类选择器
选择器是用来选择标签的,它有很多种选择语法,本节先讲解几个基本的选择器,方便展开下面的课程。原理如下:
例如页面中有这样一个标签:<div id="myid" class="box">盒子</div>
如果使用ID选择器方式选择该元素,语法如下:
#myid{
color:red;
}解释:
选择id为myid的标签,将该标签的字体颜色设置为red。
如果使用标签选择器方式选择该元素,语法如下:
div{
color:red;
}
解释:
选择标签名为div的标签,将文字颜色设置为red。如果使用class选择器选择该元素,语法如下:
.box{
color:red;
}解释:
选择类名为box的元素,将文字颜色设置为red。请注意:如果页面中存在相同的id、标签或类名,则会选中多个元素,{}中间写针对选中元素的css样式代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>基本选择器 id 标签 class类选择器</title>
</head>
<body>
<div id="myid">盒子</div>
<span>span标签</span>
<span>span标签</span>
<div class="box">我的标签</div>
<div class="box">我的标签</div>
</body>
<style>
/* id选择器 */
#myid{
color:red;
}
/* 标签选择器 */
span{
color:green;
}
/* class类选择器 */
.box{
color:blue;
}
</style>
</html>
读了你的观点我很受用,也很感激,你说出了我们都存在,但都又没有太重视的问题,我想,它将伴随着我以后的学习和工作. 高手!!! 我是个新手,看了此文章让我感触良深,更给了我学习的动力.我是学医的,现大二,不过我更喜欢的是电脑,同学那我找不到有共同爱好的,在这里好多知音啊!我是一个刚进不入高校的大门,看后受到很大的启发!~每天看8页编程书,看几遍论坛的文章,再加上几道练习,相信同学4年后毕业的技术应该跟我差不多!~ ^好 看来我现在的数据结构与算法还听有用的我要把他给学好谢谢楼主 啊,真的很受用我也打算学习编程,看了这篇文章,我也跟作者有一些相同的看法。 我想我现在知道自已该做什么了,受益匪浅,谢谢 谢谢,受教了!呵呵。早点看到就好了呀!! 真的很不容易呀!说的好! ^精华啊,虚心学习