python全栈开发_day46_html文本标签

长宽:
width
heigth

字体属性
font-family
font-size
font-weigth

背景
背景颜色
背景图片
如果背景图片尺寸小于所在的区域尺寸那么默认情况下
是铺满整个区域
可以通过指定参数来控制是否铺满
no-repeat
repeat-x
repeat-y
center center
15px 20px

backgroud:背景颜色 背景图片 是否铺满 位置

文字属性
text-align:center;

text-decoration:none; 主要就是用于去除a标签自带的下划线

text-indent:48px; 用于首行缩进

ul {list-style-type:none}



边框
border-style
border-size
border-color

border:3px solid red;
border-left:3px solid red;
border-top:3px solid red;
border-right:3px solid red;
border-bottom:3px solid red;


display
div {display:none} 不显示不占位
inline
block
inline-block 让行内标签也能设置长宽

画圆
div {border-radius:50%;}




盒子模型
margin:用来调节盒子与盒子之间的距离(标签与标签之间距离)
border:盒子的包装厚度(边框)
padding:内部物体与盒子之间距离(文本与边框之间的距离)
content:物体大小(文本内容)


浮动
只要是页面布局 都会用到浮动

浮动带来的影响:
脱离文档流,造成父标签塌陷


定位
相对定位:相对于标签本身原来的位置
绝对定位:相对于已经定位过的父标签(小米购物车)
固定定位:相对于浏览器窗口固定在某一个位置(回到顶部)


是否脱离文档流:
脱离文档流:
1.浮动
2.绝对定位
3.固定定位

不脱离文档流:
1.相对定位

猜你喜欢

转载自www.cnblogs.com/xuxingping/p/10971433.html
今日推荐