Css属性
- 文字属性
1.文字大小 font-size
pc端基本像素 px px 文字大小默认16px; 支持的最小文字是12px; 不要使用奇数 rem,em,vw,vh,pt 移动端常用单位
2.文字粗细 font-weight:bold;
属性值:normal 正常不加粗(默认) bold加粗 bolder(更加粗)
lighter(变细)
100-900 整百整百的数值 400是默认值(不能带单位)
3.文字倾斜 font-style:iatilc 正常默认值也是normal
italic 倾斜属性值
4.文字字体 font-family
windows操作系统默认字体是微软雅黑
当有多个属性值时,首先显示第一个字体,系统不支持再显示第二个
都不支持的话显示系统默认字体
属性值为中文时需要加"“号
多个单词之间也需要加”"号
5.文字的颜色 color
属性值:英文单词
16进制 #000000 0-f
rgb3原色 rgb(0-255,0-255,0-255)
- 文本属性
1.文本水平对齐方式 text-align-center(中) left(默认值是左) right(右) 2.垂直方向对齐方式 vertical-align 属性值 top上 middle中 bottom下 baseline 基线 3.行高 line -height 行与行之间的距离 属性值 数值＋单位 pc端常用单位 px像素 数值 几倍几倍行距 当line height==height时,实现单行文本垂直方向居中 4.文本修饰 text-decoration 属性值: underline下划线啊 line-through删除线 overline下划线onoe 去掉下划线 5.文本首行缩进 text-indent 属性值: 数值+单位 常用单位px/em 可以为负值 6.复合属性: font: weight style size/line-height family 文字大小和文字字体不能够省略 书写顺序不能错
- 背景:background
1.背景颜色 background-color 2.背景图片 background-image url() 3.背景图片平铺 background-repeat 属性值: repeat平铺(默认值) no-repeat 不平铺 repeat-x水平方向平铺 repeat-y垂直方向平铺 4.背景图片的位置 background-position 属性值 : 值1 值2 数值＋单位 属性值可以为负数 值1表示水平方向 值2表示垂直方向 如果只设置一个值,只代表水平方向,垂直方向默认会居中 方位词:left right top bottom center 5.背景图片固定:background-attachment 属性值:scroll 滚动(默认值) 属性值:fixed 永远固定在可视窗口 6.背景图片的大小 background-size cover图片等比例缩放, 直到撑满整个盒子 图片会出现裁剪 contion 图片等比例缩放,直到撑满某个方向 会出现留白 7.背景复合属性background:颜色 路径 平铺 固定 位置 没有顺序要求 没有数量要求 背景图片大小是c3新增的所以不能放进去
- 列表属性:
1.list-style-type:用来更改项目符号类型 属性值:disc实心圆(默认值) circle 空心圆 square 方块 none 取消项目符号 2.list-style-position:用来更改项目符号的位置 outside外侧(默认值) inside内侧 3,list-style-image:用图片作为项目符号类型 4.复合属性:list-style:项目符号类型 项目符号位置
- 边框属性
1.边框线型 border-style 属性值:solid 实线 dashed 虚线 double 双实线 dotted 点状线 none 去掉边框 2.边框颜色 border-color transparent(透明) 边框颜色默认为文字颜色 属性值:三种表示方法 3.边框粗细 border-width 默认3px 属性值:数值+单位 复合属性 border:线型 粗细 颜色 (线型不能省,顺序没要求) 4.单独设置某一方向上的边框 border-方位词(left right bottom top) 5.单独设置某一方向上边框的某一属性
- 溢出属性
溢出属性:overflow
属性值:
1.可见的: visible(默认值)
2.超出内容隐藏 hidden
3.显示滚动条 scroll 强制显示滚动条
4.自动显示滚动条 auto (超出时显示滚动条,不超出不显示)
overflow-x overflow-y 单独设置某一方向上的滚动条 滚动条在移动端不会显示
