CSS样式、选择器、以及字体属性基础
样式
css样式分为三种:1、行内式 2、内嵌式 3、外联式
行内式:设置在标签内部的样式
运行效果:
内嵌式:设置在head头部
运行效果:
外联式:
首先新建一个css文件,以.css结尾的文件
打开该文件直接填写样式:
在head头部应用link标签引用外部的css文件:
基础选择器
标签选择器:选择到我们想要设置的标签(不常用)
语法:
标签名{
属性:属性值;
}
例:
类选择器:给标签起一个类名,比标签选择器更精准的选择到某些标签,比较常用
id选择器
把类选择器比作人名 ,那么id选择器就是人的身份证。
类选择器可以有多个相同的, 而id选择器对应某一个具体的元素。
用法与类选择器相同,类以点(.)开头,id以#开头
通配符选择器:
选择当前页面所有标签,一般用来去除浏览器默认的内外边距,不建议应用于改变标签的字体属性、颜色等。
字体属性
font字体:
1、
font-size:设置字体大小,单位为px,不可省略。还有其他单位,但不常用。
不同的浏览器默认字体大小不一样,一般会给一个固定的值。
2、
font-family:设置字体,常用的字体有微软雅黑,宋体等
如果要设置多个字体(浏览器会自动匹配默认字体)中间用逗号隔开,如包含空格或者是中文要加双引号。
例:font-family: Arial,“Microsoft Yahei”, “宋体”;
尽量使用默认字体。
font-weight:字体粗细
属性值:
1、 normal:默认值 不加粗
2、bold:定义加粗
3、100~900:400等同于normal 700等同于bold
font-style:字体风格
属性值:
1、normal:默认值 不倾斜
2、italic:倾斜
例:
font综合写法:
选择器 {
font: font-style ;
font-weight ;
font-size/line-height ;
font-family ;
}
使用font属性时,必须按语法格式中的顺序书写,不能更换顺序,属性以空格隔开。
其中不需要设置的属性可以省略(取默认值),但必须保留font-size和font-family属性,否则font属性将不起作用。