做外贸维护网站需要注意什么,wordpress的官方文档,网站名称与备案名称不一致,开网店如何找货源和厂家前言#xff1a;这是笔者学习之后自己的理解与整理。如果有错误或者疑问的地方#xff0c;请大家指正#xff0c;我会持续更新#xff01; 看大牛张鑫旭的视屏可能会理解的更深一些#xff0c;点击这里#xff1b;
line-height#xff0c;两行文字的基线之间的距离这是笔者学习之后自己的理解与整理。如果有错误或者疑问的地方请大家指正我会持续更新 看大牛张鑫旭的视屏可能会理解的更深一些点击这里
line-height两行文字的基线之间的距离
基线英语本子中就有顶线中线基线底线
行内框盒子模型
内容区域content area一个围绕文字的看不到的盒子相当于鼠标选i中时的区域只和font-size、font-family有关内联盒子inline boxes不会让内容成块显示而是排成一行inline如果只是文字就是匿名内联盒子如span;行框盒子line boxes每一行都是一个行框盒子由内联盒子组成如果换行那就是两个行框盒子包含盒子containing box由行框盒子组成如p; 内联元素的高度是由行高决定的
高度的表现不是行高是内容区域和行间距 行高(line-height) 内容区域高度(content area) 行间距(vertical spacing) line-height:normal;默认值与font-size和font-family有关
line-height:number;根据font-size大小计算相乘的结果就是行高
line-height:length;固定值em、rem、px
line-height:percent;根据font-size计算
line-height:inherit;继承行高input默认的行高是normal
阅读类网站行高一般设置1.5就好了网站开发匹配20px20/font-size;
body{font-size:14px; line-height:1.4286} 图片底部间隙 图文混排的情况下inline元素在默认情况下的vertial-align是baseline基线对齐的这时容器高度 文字行高 - 基线位置高度 inline元素高度所以图片下边会有一段间隙 消除底部间隙的方法
改变图片元素类型vertical-align只对inline和inline-block元素有效图片设置display:block之后就不受影响了图片设置底线对齐vertical-alignbottom父容器行高足够小基线上移父容器设置line-height0或者font-size0 代码如下 !DOCTYPE html
htmlheadmeta charsetUTF-8title/titlestyle typetext/css*{padding: 0;margin: 0;}.wrapper{width: 300px;background: #0ff;margin: 100px;line-height: 0;/*font-size: 0;也可以哦0*00 */}.wrapper img{width: 150px;}/style/headbodydiv classwrapperimg srcimages/1.jpg//div/body
/html View Code