这两天开始学习CSS样式,“初来乍到” 什么都不懂。经过这两天的学习,终于对CSS有一点点的了解。现在就我初学始的问题讲下,这个问题有很多人不怎么理解。就是如何区分 "." 与 " # "。
当我们在写css时无可避免的要用到这两个字符。但是什么时候用呢?这要看你是用类选择符还是ID选择符,如果是用类选择符就用".",如果是用ID选择符就用" # "。
下面我们就举个例子加以说明:
1. 假如你想要两个不同的段落,一个段落向右对齐,一个段落居中,你可以先定义两个类:
p.right { text-align: right}
p.center { text-align: center}
或者.center { text-align: center} (定义.center的类选择符为文字居中排列)
然后用不在不同的段落里,只要在HTML标记里加入你定义的class参数:
<p class="right">
这个段落向右对齐的
</p>
<p class="center">
这个段落是居中排列的
</p>
2. ID选择符的应用和类选择符类似,只要把CLASS换成ID即可。将上例中类用ID替代:
<p id="intro">
这个段落向右对齐
</p>
定义ID选择符要在ID名称前加上一个“#”号。和类选择符相同,下面这个例子,ID属性将匹配所有id="intro"的元素:只要是id是“intro”的都应用这个样式,而不用写class=“intro”。
#intro
{
font-size:110%;
font-weight:bold;
color:#0000ff;
background-color:transparent
}
(字体尺寸为默认尺寸的110%;粗体;蓝色;背景颜色透明)
总之,如果是用"." 的话就是当你要写出class等于什么的时候,而用“#”则表示一定声明了ID值。
当我们在写css时无可避免的要用到这两个字符。但是什么时候用呢?这要看你是用类选择符还是ID选择符,如果是用类选择符就用".",如果是用ID选择符就用" # "。
下面我们就举个例子加以说明:
1. 假如你想要两个不同的段落,一个段落向右对齐,一个段落居中,你可以先定义两个类:
p.right { text-align: right}
p.center { text-align: center}
或者.center { text-align: center} (定义.center的类选择符为文字居中排列)
然后用不在不同的段落里,只要在HTML标记里加入你定义的class参数:
<p class="right">
这个段落向右对齐的
</p>
<p class="center">
这个段落是居中排列的
</p>
2. ID选择符的应用和类选择符类似,只要把CLASS换成ID即可。将上例中类用ID替代:
<p id="intro">
这个段落向右对齐
</p>
定义ID选择符要在ID名称前加上一个“#”号。和类选择符相同,下面这个例子,ID属性将匹配所有id="intro"的元素:只要是id是“intro”的都应用这个样式,而不用写class=“intro”。
#intro
{
font-size:110%;
font-weight:bold;
color:#0000ff;
background-color:transparent
}
(字体尺寸为默认尺寸的110%;粗体;蓝色;背景颜色透明)
总之,如果是用"." 的话就是当你要写出class等于什么的时候,而用“#”则表示一定声明了ID值。