div文字垂直居中

div文字垂直居中

1.单行文字

设置div的高度与文字的行高一样就可以了,即 line-height 和 height 的数值是一样的就可以了,最后给div一个 over-flow: hidden ,让超出的部分隐藏.

这种方法支持块级和内联极元素以及所有的浏览器,不过只能显示一行,而且IE中不支持< img >等的居中,之所以要用 overflow: hidden ,是因为当用户放大字体时,字会超出div的范围.

插入代码:
div{

height: 20px;

line-height: 20px;

overflow: hidden;

}

2.多行文字

很简单,只要设定一样的 padding-bottom 和 padding-top 就可以了

插入代码:
div{

padding-top: 20px;

padding-bottom: 20px;

}

这种方法同时支持块级和内联极元素以及非文本内容,包括图片等等,也支持所有浏览器,不足的就是不能固定高度

现在比较好用的就着两种方法了,当然还可以利用浏览器的CSS hack,用得比较少,就不多讲了.

转载于:https://my.oschina.net/working/blog/139222

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-用户IM,转载请注明出处:https://javaforall.cn/110095.html原文链接:https://javaforall.cn

【正版授权,激活自己账号】: Jetbrains全家桶Ide使用,1年售后保障,每天仅需1毛

【官方授权 正版激活】: 官方授权 正版激活 支持Jetbrains家族下所有IDE 使用个人JB账号...

(0)


相关推荐

  • kettle下载安装使用教程

    kettle下载安装使用教程Kettle简介Kettle是一款国外开源的ETL工具,纯java编写,可以在Window、Linux、Unix上运行, 数据抽取高效稳定。Kettle中文名称叫水壶,该项目的主程序员MATT希望把各种数据放到一个壶里,然后以一种指定的格式流出。Kettle这个ETL工具集,它允许你管理来自不同数据库的数据,通过提供一个图形化的用户环境来描述你想做什么,而不是你想怎么做。Kettle中有两…

  • 19-爬虫解析利器pyquery详解[通俗易懂]

    19-爬虫解析利器pyquery详解[通俗易懂]强大灵活的网页解析库。如果你觉得正则写起来太麻烦,或者BeautifulSoup语法太难记,如果你熟悉jQuery的语法,那么pyquery就是最佳选择。它与jQueryapi相同,可以无缝迁移1.pyquery库的了解pyquery库是jQuery的Python实现,能够以jQuery的语法来操作解析HTML文档,易用性和解析速度都很好。1.1pyquery库的安装方法:在cmd输入:pipinstallpyquery1.2pyquery库的引用:(注意大小写)frompyq

  • 【面试必备】这道MySQL面试题难住了90%的程序员。。。「建议收藏」

    【面试必备】这道MySQL面试题难住了90%的程序员。。。

  • Docker EE 统一应用程序管理功能大揭秘,你想要的都在这里!

    Docker EE 统一应用程序管理功能大揭秘,你想要的都在这里!

  • server .mappath[通俗易懂]

    server .mappath[通俗易懂]1.Server.MapPath(“/”) 应用程序根目录所在的位置如C:/Inetpub/wwwroot/2.Server.MapPath(“./”) 表示所在页面的当前目录   注:等价于Server.MapPath(“”) 返回Server.MapPath(“”)所在页面的物理文件路径3.Server.MapPath(“../”)表示上一级目录4.Serve

  • 焦点科技怎么老是招人_苹果链,蓝思科技,歌尔股份,立讯精密,欧菲光,谁是老大?…

    焦点科技怎么老是招人_苹果链,蓝思科技,歌尔股份,立讯精密,欧菲光,谁是老大?…苹果链在6月初到7月中旬走了一波行情,目前又到了反复阶段,在大盘逐步整理,又回到结构性的状态的弱势时期,在资金在板块之间游离的情况下,不少投资者把目光关注到近期没有震荡,保持一定平稳的板块,不少投资者就注意到了苹果链板块上,那么这几只个股,究竟谁是老大?蓝思科技大家好,我是蓝思科技,我主营中高端视窗防护玻璃面板、外观防护新材料的研发、生产。不忙,这只我基本的操作,算不上什么,仔细看着大家,我有玻璃…

发表回复

您的电子邮箱地址不会被公开。

关注全栈程序员社区公众号