CSS选择器,字体属性 | 青训营笔记

138 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第29天

CSS简介

CSS 是层叠样式表 ( Cascading Style Sheets ) 的简称.有时我们也会称之为 CSS 样式表或级联样式表。 CSS 是也是一种标记语言

CSS基础选择器

包括:标签选择器,类选择器,ID选择器,通配符选择器

标签选择器

标签选择器(元素选择器)是指用 HTML 标签名称作为选择器,按标签名称分类,为页面中某一类标签指定统一的 CSS 样式。 语法:
标签选择器{
属性:属性值
...
}

类选择器

如果想要差异化选择不同的标签,单独选一个或者某几个标签,可以使用类选择器. 我们可以给一个标签指定多个类名,从而达到更多的选择目的。
.类名 {
属性1: 属性值1;
...
}

ID选择器

id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。 HTML 元素以 id 属性来设置 id 选择器,CSS 中 id 选择器以“#" 来定义。 语法:
#id名 {
属性1: 属性值1;
}
注意:id 属性只能在每个 HTML 文档中出现一次

通配符选择器

语法:
* {
属性1: 属性值1;
...
}
通配符选择器不需要调用, 自动就给所有的元素使用样式

字体属性

1. 字体大小

CSS 使用 font-size 属性定义字体大小.语法:

     p {  
        font-size: 20px; 
    }

2.字体粗细:

CSS 使用 font-weight 属性设置文本字体的粗细。语法:

    p {  
        font-weight: bold; 
    }

3.字体样式:

CSS 使用 font-style 属性设置文本的风格。语法:

    p {  
        font-style: normal;
    }

4.字体的综合写法

字体属性可以把以上文字样式综合来写, 这样可以更节约代码:

 body {   
 font: font-style  font-weight  font-size/line-height  font-family;
 }

使用 font 属性时,必须按上面语法格式中的顺序书写,不能更换顺序,并且各个属性间 以空格隔开 不需要设置的属性可以省略(取默认值),但必须保留 font-size 和 font-family 属性,否则 font 属性将不起作用