一、文本属性
1.文本大小
属性:font-size 属性值...px/...pt(备注:a.字体大小为0可以不接单位b.浏览器
默认的字体大小是16px。c.默认最小大小是12px,设置文本大小都为偶数。
d.pt 磅,打印设备)
2.字体类型
属性:font-famiy;(a.当属性值为中文的时候,需要加" ",b.当属性值为一个英文
的时候,可以不加" ",当属性为多个英文是需要加" ",c.在浏览器默认字体是微软
雅黑,win默认字体是宋体/新宋体.英文是arial)
3.字体加粗
属性:font-weight 属性值:(a.数字100-900,正常字体600-900加粗;b.
bold/bolder bold加粗 bolder更粗,浏览器区别不明显。c.normal正常)
4.字体倾斜
属性:font-style 属性值{itall/ablqpe/normol}
5.行高
属性line-height 值:value px
6.复写法
7.文本颜色
属性:color a.英文单词;b.十六进制#000000 A-F 0-9 c.rgb(red,green,blue)
d.raba(,,,alpha)透明0-1 备注:rgb改变所有,rgba只改变字体。
8.检索字母大小写
属性:text-transform 值:capitdizen 首字母
9.设置文本小型大写字母
10.文本对齐方式
水平对齐属性:text-align(left,right,center)
垂直对齐属性:vertical-align(top,middle,bottom)
11.文本修饰
属性:text-decoration
值:none=空
underline=下划线
overline=上横线
line-through=删除线
12.首行缩进
text-indent:value值
13.字间距
letter-spacing:value值
14.词间距
Word-spacing:value值
二、列表属性
1.
属性:list-style-type:
值:disc(实心 圆)circle(空心圆)square(方块)none(去除)
2.图片列表属性
list-style-image:url(图片路径)
三、边框属性
属性:border
bordercolor:边框颜色
border-width:边框宽度
border-style:(solit/dashed/dotted/double)
四、背景图属性
1.背景颜色
background:
2.背景图片
background-image:url(图片路径)
3.背景颜色平铺属性
属性background-repeat:repeat平铺(no-repeat不平铺)
4.背景图片的位置
属性:background-position 值:x/y(x(center/left/righgt)y(top/center/bottom))
5.背景图的固定
属性background-attachment
值:fixed(固定) scroll(滚动)
五、浮动属性
属性:float
值:left/right/none
备注:1.只能规定网页中左右位置的变化2.浮动元素是脱离文档流
3.浮动元素直到碰到前一个含有浮动元素的边框,也会停止浮动
4.当浮动碰到前一个含有浮动元素的边框,也会停止浮动
5.当父级宽度不足以放下子级元素时,最后的一个小盒子会往下移动直到
有足够空间。
六、高度坍塌
前提父级没有高并且子级含有浮动
解决(1.在父级上添加高度,2.在父级上添加overflow:hidden,BFC规则
块级格式化上下文)
BFC条件:
1、float的值不是none。
2、position的值不是static或者relative。
3、display的值是inline-block、table-cell、flex、table-caption或者inline-flex
4、overflow的值不是visible