文本垂直居中对齐是一个很常见的问题,这里总结一下。

  一、容器高度固定,单行文本垂直居中对齐

height:20px;
line-height:20px;
overflow:hidden;

  二、容器高度固定,多行文本垂直居中对齐

padding-top:10px;
padding-bottom:10px;
line-height:20px;

  三、容器高度自适,单行/多行文本垂直居中对齐

.targetList dl dt div {
width:265px;
height:50px;
display:table-cell;
vertical-align:middle;

}
.targetList dl dt strong {
text-decoration:none;
font-size:16px;
line-height:16px;
color:#177bb0;
font-weight:bold;
vertical-align:middle;

}

  先这样。

CSS 文本垂直居中对齐的更多相关文章

  1. html文本垂直居中对齐

    html文本垂直居中对齐,代码如下: <div id="box" style="height:100px; line-height:100px; border:1p ...

  2. css文本两端对齐

    在做表单时我们经常遇到让上下两个字段对齐的情况,比如姓名, 手机号码, 出生地.这样我们就要用到 text-align, text-justify样式了. text-align直接设为justify就 ...

  3. css文本垂直居中的实现

    本案例已经有新的比较简便的解决方案,可以直接采用 vertical-align:middle 样式对行内元素进行垂直居中布局,详见: 微信小程序开发——如何让商品标题类文本根据内容长度垂直居中. 以下 ...

  4. css水平垂直居中对齐方式

    1.文字或者内联元素的垂直水平居中对齐 css属性 -- 水平居中:text-aligin:center; 垂直居中: line-height:height; 例子:. html: <div c ...

  5. css 文本两端对齐

    在做表单时我们经常遇到让上下两个字段对齐的情况,比如姓名, 手机号码, 出生地.这样我们就要用到 text-align, text-justify样式了. text-align直接设为justify就 ...

  6. css文本垂直居中

    1,一般flexca 2,行高 3,行高加边框或者透明边框

  7. CSS文本垂直居中显示

    <style> .sty1 { width: 300px; height: 200px; background-color: black; text-align: center; colo ...

  8. div中字垂直居中对齐

    div中的文本水平居中,一般都是用text-align:center;就可以解决,那么垂直居中呢,知道vertiacl-align:middle;但有时候却不起作用:整理下div中文本垂直居中对齐的问 ...

  9. css 文本和div垂直居中方法汇总

    https://blog.csdn.net/u014607184/article/details/51820508 https://blog.csdn.net/liuying1802028915/ar ...

随机推荐

  1. springMVC多视图的支持

    1.在springmvc.xml中加上 <!-- 多视图的支持 --> <bean class="org.springframework.web.servlet.view. ...

  2. spring boot2.1读取 apollo 配置中心3

    上篇记录了springboot读取apollo的配置信息,以及如何获取服务端的推送更新配置. 接下来记录一下,如何获取公共namespace的配置. 上文中使用如下代码共聚公共命名空间的配置: @Ap ...

  3. CDN专业一站式解决方案

    调度,弱网加速,动态防御,无限节点(重)新技术

  4. [WCF安全3]使用wsHttpBinding构建基于SSL与UserName授权的WCF应用程序

    上一篇文章中介绍了如何使用wsHttpBinding构建UserName授权的WCF应用程序,本文将为您介绍如何使用wsHttpBinding构建基于SSL的UserName安全授权的WCF应用程序. ...

  5. Maven打可执行包的pom.xml配置

    单独打出可执行包,然后将依赖包打入lib文件价中 <build> <plugins> <plugin> <groupId>org.apache.mave ...

  6. webBrowser.DocumentText重新赋值无效解决方法

    因为webBrowser这个控件的webBrowser.DocumentText是异步的,所以要自己调用刷新: webBrowser.Navigate("about:blank") ...

  7. java poi分批次导入Excel

    最近换了新工作,公司要求导入Excel要分批次导入,并且是多线程的情况下执行导入,查了很多资料,没看到比较复合的,就打算自己写一个吧,可能有不足,希望指出. 上面说到多线程,这边就不贴出代码了,具体思 ...

  8. 我的json

    { "firstName":[ "xMan" ], "members":[ { "name":"X教授&quo ...

  9. JS判断键盘上的上下左右键

    document.onkeydown=function(event){ var e = event || window.event || arguments.callee.caller.argumen ...

  10. NetHogs 实时检测网络流量 转

    有很多适用于Linux系统的开源网络监视工具.比如说,你可以用命令iftop来检查带宽使用情况. netstat用来查看接口统计报告,还有top监控系统当前运行进程.但是如果你想要找一个能够按进程实时 ...