一、认识CSS样式
CSS全称为“层叠样式表 (Cascading Style Sheets)”,它主要是用于定义HTML内容在浏览器内的显示样式,如文字大小、颜色、字体加粗等。
如下列代码:
<style type="text/css">
p{
font-size:20px;/*设置文字字号*/
color:red;/*设置文字颜色*/
font-weight:bold;/*设置字体加粗*/
}
</style>
使用CSS样式的一个好处是通过定义某个样式,可以让不同网页位置的文字有着统一的字体、字号或者颜色等。
二、CSS样式的优势
如果想把一段文本中的某几个短语设置位红色,就可以通过设置CSS样式来设置,而且只需要一条CSS样式语句。
- 把需要设置的短语用
<span></span>
括起来。 - 写入一下代码:
<style type="text/css">
span{
color:blue;
font-size:20px;
font-weight:bold;
}
</style>
三、CSS代码语法
CSS样式由选择符和声明组成,而声明又有属性和值组成。如下图:
选择符:又称选择器,指明网页中要应用样式规则的元素,如下:网页中所有的段(p)的文字将变成蓝色,而其他的元素(如ol)不会受到影响。
声明:在英文大括号“{}”中的就是声明,属性和值之间用英文冒号“:”分隔。当有多条声明时,中间可以英文分号“;”分隔。
p{
font-size:12px;
color:red;
}
四、CSS注释代码
就像在Html的注释一样,在CSS中也有注释语句:用/*注释语句*/
来标明(Html中使用<!--注释语句-->
)。就像下面代码:
<style type="text/css">
/*设置段落默认格式*/
p{
font-size:12px;/*设置字体大小*/
color:red;/*设置字体颜色*/
}
</style>