首页 >> 资讯 >

CSS 结构与样式相分离

2023-05-30 14:32:58 来源:哔哩哔哩

CSS


(相关资料图)

结构与样式相分离

选择器以及一条或多条声明

每条声明(键值对)之后需要用分号;结尾

基础选择器分类:

1.标签选择器<p> <div>等 用HTML标签名作为选择器

2.类选择器

通过class=类名 调用(类名过长的话可以用短横线-分隔)

多类名(便于复用)

Class=类名 类名 …

3.id选择器

通过id=id名 调用 (与类选择器调用一样)

???区别在于 -》》》》只能被调用一次!!!

4.通配符选择器

基础选择器总结

字体 font

font-family:指定字体系列

微软雅黑/’Microsoft YaHei’;宋体…

指定多种字体,逐个找,是否存在,如果找到则用改字体显示,否则用系统自带的字体显示

font-size:指定字体大小

特俗情况标题标签需要单独指定文字大小

全局指定文字大小Body{font-size:16px;}

font-weight:指定字体粗细

normal :正常 ->400

bold:加粗,效果同strong

bolder:特粗体

lighter:细体

number:通过数字体现粗细--à

->700=bold

font-style:指定字体文字样式

normal:正常

italic:斜体=em

字体复合属性

顺序有要求,节约代码量;部分属性可以省略,但有的必须有

文本属性Text

Color:文本颜色

Text-align:对齐文本

只能设置水平对齐

Text-decoration:装饰文本

可以用于去除a(链接)默认的下划线text-decoration:none

Text-indent:文本缩进

段落文本缩进的效果Text-indent:20px;

Em单个字符的距离

Line-height:行间距(行高)

行高测量工具:FastStone

CSS引入方式

内部样式表:将样式写到HTML页面内部,放到style标签内部:个人感觉这种比较常见

行内样式表(内联样式表):用于修改少量样式

外部样式表:单独建css文件,之后引入到HTML中:实际开发中最常见

标签:
x 广告
x 广告

Copyright ©  2015-2022 华东创投网版权所有  备案号:京ICP备2022016840号-41   联系邮箱:2 913 236 @qq.com

返回顶部