今日学习内容
css字体属性
字体外观
使用font-family属性来定义文本的字体样式
各种字体字体之间英文的逗号隔开
字体由多个英文单词构成时用引号将字体名称引起来
Unicode字体
字体大小
使用font-size控制字体大小,单位是px,在body标签中去设置整个页面的字体大小
字体样式
使用font-style设置文本的风格
normal(默认值,标准字体样式)
italic斜体
字体粗细
使用font-weight属性来设置文本的粗细,400代表正常字体大小,700代表加粗字体,注意:属性值后面不加像素单位
字体的复合属性
font属性中不能省略font-size和font-family,使用font属性时,要严格按照固定的顺序来进行书写,不能更换顺序,各个属性之间要用空格隔开
CSS的文本属性
文本颜色
使用color调用
英文字母调用
十六进制调用
rgb代码
文本对齐
text-align
文本装饰
text-decoration
none:默认没有装饰线
underline:有下划线
文本缩进
text-indent
可以设置为px或者em,当前元素没有设置大小就按照父元素字体大小设置
行间距
line-height
CSS中使用line-height来设置行间的距离(行高),可以控制文字行与行之间的距离,值可以写具体的像素值,也可以写倍数(经常在body中设置)
控制文本达到边界是否换行
white-space
normal:默认达到边界自动换行
nowrap:达到边界不换行
CSS的引入方式
行内样式表
直接在元素内部写style属性,将要设定的属性值写在style=后面
内部样式表
在head标签中的style标签内书写
通过这种方式虽然可以实现控制页面中结构的样式,但是没有完全实现结构和样式的分离
外部样式表
将CSS代码单独放到css文件中,再将文件引入到html文件中进行使用
先创建css文件,然后直接写css代码 div {}
在html中用link标签引入css文件
在一个css文件中通过@import url来引入多个css文件,然后再用link标签引入汇总后的css文件
Emmet语法
直接输入标签 使用tab来自动补全
标签名称p*5可以引入5个p标签
父子级标签div>p
兄弟级标签div+p
生成带有id属性的标签:用#加id名称,生成带有class属性的标签:用.加class属性名称
使用自增符号$, 来实现类名的区分
生成多个标签同时写入内容div{内容}*5
使用缩写可以直接补全代码比如tac:taxt-align:“center”
|