转自:https://blog.csdn.net/weirenkuan/article/details/51177695

使用display:table-cell,span中内容无论多少,都可以垂直居中

<div style="display:table-cell;height:100px;font-size:12px;font-height:14px;vertical-align:middle;text-align:center">

<span>

ceshiceshi

</span>

</div>

另外,有设置line-height等于外面div的height方法,但是无法正常显示太长的内容

另:设置div在div中的位置:https://blog.csdn.net/buyaoxx/article/details/77850575

设置span在div中垂直居中的更多相关文章

  1. 设置文字在div中垂直居中,使用line-height

    (从已经死了一次又一次终于挂掉的百度空间人工抢救出来的,发表日期2014-02-19) line-height 行间距 详细使用方法:http://www.w3school.com.cn/css/pr ...

  2. “display:block-inline形式的Span或Div中添加文字后,导致Span或Div排版掉落、错位”的原因及解决方法

    最近在使用3个span(或div)制作带圆角边框的按钮时,按照常识,把span的display设置成inline-block,这样就可以设置span的width和height了,很爽的~ 可是当我在中 ...

  3. 未知行数的文字在div中垂直居中

    今天工作中遇到一个问题,就是未知行数的文字在div中怎么垂直居中,如下面的3个图: 图1 图2 图3 图1是2行文字的效果,图2是不经过css垂直居中处理的效果,图3是经过css垂直居中后的效果,ht ...

  4. p标签在div中垂直居中,并且div高度随着p标签文字内容的变化而变化

    1.div设置flex布局 div{ display: flex; align-items: center; } 2.div不要设置height,设置min-height

  5. 设置 img 在 div 中水平居中和垂直居中

    Ø  前言 写 html + css 时,img 标签的垂直与水平居中,应该是很常见的设计.实现的方式很多,但是容易遗忘,下面分别整理了几种实现方式. 1.   css 代码 <style ty ...

  6. CSS-布局【1】-图片在div中垂直居中

    方法一:通过增加100%高度行内块居中对齐 <!DOCTYPE html> <html> <head> <meta name="viewport&q ...

  7. 不定宽高的文字在div中垂直居中

    本人在面试的时候被问到:如何使一段不定宽高的文字垂直居中呢? 现在来总结一下: 在body中写入结构 <div id="main">    <div id=&qu ...

  8. 尺寸不固定的图片在div中垂直居中并完全显示

    前几天做一个项目,需要批量上传图片,图片外侧div尺寸固定:由于图片是用户输入的,所以大小存在不确定性,产品需求是无论图片尺寸多大,都要垂直居中完全显示 废话不多说,直接上代码 html <ul ...

  9. 二十:让行内元素在div中垂直居中

    (1)使用display:table-cell配合vertical-align:center(淘宝也是这样用的) <div class="method4"> <s ...

随机推荐

  1. svg image标签降级技术

    1.svg image标签降级技术: svg不能很好的在anroid2.3中得到支持,需要额外的补充,IE8-以及Android 2.3默认浏览器是不支持SVG的. svg image标签降级技术,这 ...

  2. Android -- Camera2(Android5.0)

    Camera2 Camera2是Android5.0中的其中一个新的特性,新的API.与原来的camera API相比,不同之处在于: 原生支持RAW照片输出 突发拍摄模式 制约拍照速度的不再是软件而 ...

  3. Python机器学习实践与Kaggle实战(转)

    https://mlnote.wordpress.com/2015/12/16/python%E6%9C%BA%E5%99%A8%E5%AD%A6%E4%B9%A0%E5%AE%9E%E8%B7%B5 ...

  4. MySql查询时间段的方法(转)

    http://www.jb51.net/article/58668.htm 本文实例讲述了MySql查询时间段的方法.分享给大家供大家参考.具体方法如下: MySql查询时间段的方法未必人人都会,下面 ...

  5. c语言统计程序执行时间

    c语言程序执行时间 #include <iostream> #include <cstdio> #include <ctime> int main() { std: ...

  6. glValidateProgram只用于调试

    glValidateProgram应该只用于调试,用于release版本中会影响性能.以下是详细描述:   Before doing so, however, we might want to che ...

  7. Android开发点滴 - 实现层级式导航(API 16+)

    在Jelly Bean(API 16)以前,为了实现顶部的导航菜单,程序员们不得不手工写代码, 神马在OnCreate啊,神马onOptionsItemSelected啊,但是,现在一切都是浮云了. ...

  8. 牛客网-《剑指offer》-包含min函数的栈

    题目:http://www.nowcoder.com/practice/4c776177d2c04c2494f2555c9fcc1e49 辅助栈 C++ class Solution { public ...

  9. Android 在闹钟开机时,如何解决开机动画没有播完就进入Launcher M

    前言          欢迎大家我分享和推荐好用的代码段~~ 声明          欢迎转载,但请保留文章原始出处:          CSDN:http://www.csdn.net        ...

  10. Qt通过ODBC连接SQL Server2008实践总结

    Qt连接数据库的方式很多,这里说明一种最常用也是最实用的方式,因为这种方式在Windows上开发程序使用起来非常方便,并且也是远程连接数据库所需要用到的方式. 前提工作: 在Win7下安装了SQL S ...