24文字溢出处理
单行溢出三件套,静止换行溢出到。多行处理仅截断,容器文字高计算。
单行溢出三件套,静止换行溢出到。
单行文本溢出处理方法一般是打点展示
div {
white-space: nowrap;
/*表示多余不换行*/
overflow: hidden;
/*溢出部分隐藏*/
text-overflow: ellipsis;
/*打点展示*/
多行处理仅截断,容器文字高计算。
多行在 pc端仅做截断处理 需要计算好容器高度和行高之间的关系避免截断半截的情况
25背景图片
背景图片引路径,是否铺叠横竖进。图片大小设宽高,定位左右居中到。
背景图片引路径,是否铺叠横竖进。
图片大小设宽高,定位左右居中到。
div {
background-image: url("图片路径");
background-repeat: no-repeat;
/*是否平铺*/
background-size: 100% 100%;
/*背景图片大小*/
background-position: center center;
/*背景图片位置*/
}
26图片代替文字
文字缩进容器外,禁止换行溢出在。
忽略内容有宽高,只设边距图片到。
如若加载网不妙,文字代替图片效。
27文本和文本类元素对齐方式
内联标签和文字,以底为准对一次。
行块元素文外,内容文本对齐怪。
设置文本对齐线,垂直属性上下变。
内联标签和文字,以底为准对一次。
内联标签和文字在一起会以地为标准对齐
行块元素文字外,内容文本对齐怪。
当inline-block 元素内部没有文字 外部也有文字那么 外部文字会和元素底对齐
当inline-block 元素内部有文字 外部也有文字那么 外部文字会和内部文字底对齐
设置文本对齐线,垂直属性上下变。
设置对齐线
vertical-align: 30px;调整的是外部文本和自己的对齐位置 自己保持不动