display:table  元素会作为块级表格来显示(类似table);表格前后带有换行符;

display:table-cell 元素会作为表格单元格来显示(类似<td> 和 <th>)

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style> .wrap {
display:table;
width: 600px;
height: 300px;
background-color: pink;
margin:300px auto;
}
.box {
display:table-cell;
/*height:300px; 这个可以没有*/
text-align:center;
vertical-align:middle;
} </style>
</head>
<body>
<div class="wrap">
<div class="box">
投资发展有限公司
</div>
</div>
</body>
</html>

display:table一般是使用在父元素上,display:table-cell 是使用在子元素上。

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<title>demo</title>
<style type="text/css">
.box {
width: 500px;
height: 300px;
border: 1px solid #FFF;
background-color: #;
display: table;
}
.wrap{
display: table-cell;
vertical-align: middle; } </style>
</head>
<body> <div class="box">
<div class="wrap">
我是文字随便几行我是文字随便几行我是文字随便几行我是文字随便几行我是文字随便几行我是文字随便几行固定宽度的文字自动换行并垂直剧中固定宽度的文字自动换行并垂直剧中
</div>
</div>
</body>
</html>

display:table / display:table-cell 用法的更多相关文章

  1. css中display设置为table、table-row、table-cell后的作用及其注意点

    html: <div class="table"> <div class="row"> <div class="cell ...

  2. Display Tag Lib Table进行分页

    Display Tag Lib是一个标签库,用来处理jsp网页上的Table,功能非常强,可以对的Table进行分页.数据导出.分组.对列排序等等,反正我在做项目时需要的功能它都给我提供了,而且使用起 ...

  3. 配合bootstrap实现的table 嵌套table

    不要忘了引入bootstrap.css库 html部分 <div class="container"> <div class="row"> ...

  4. InnoDB INFORMATION_SCHEMA Temporary Table Info Table

    InnoDB INFORMATION_SCHEMA Temporary Table Info Table INNODB_TEMP_TABLE_INFO提供有关InnoDB实例中当前活动的用户创建的In ...

  5. ArcGIS engine中Display类库——Display

    转自原文  ArcGIS engine中Display类库——Display Display类库包括了用于显示GIS数据的对象.除了负责实际输出图像的主要显示对象(display object)外,这 ...

  6. Java&Selenium处理页面Table以及Table中随机位置的数据

    一.摘要 前一段时间公司小伙伴刚刚接触自动化,遇到的一个问题,页面新创建的数据保存后,出现在table中的某个位置,并不一定是第一行还是第几行,这种情况下如何去操控它 本篇博文将介绍处理这个问题的一种 ...

  7. mysqldump:Couldn't execute 'show create table `tablename`': Table tablename' doesn't exist (1146)

    遇到了一个错误mysqldump: Couldn't execute 'show create table `CONCURRENCY_ERRORS`': Table INVOICE_OLD.CONCU ...

  8. ORA-01747: user.table.column, table.column 或列说明无效

    Oracle.DataAccess.Client.OracleException ORA-01747: user.table.column, table.column 或列说明无效 原因1: 查了一下 ...

  9. SQLServer temporary table and table variable

    Temporary tables are created in tempdb.  The name "temporary" is slightly misleading, for ...

  10. Oracle10g 回收站及彻底删除table : drop table xx purge

    drop后的表被放在回收站(user_recyclebin)里,而不是直接删除掉.这样,回收站里的表信息就可以被恢复,或彻底清除. 1.通过查询回收站user_recyclebin获取被删除的表信息, ...

随机推荐

  1. HDU 1022 Train Problem I (数据结构 —— 栈)

    Problem Description As the new term comes, the Ignatius Train Station is very busy nowadays. A lot o ...

  2. Redis+EJB实现缓存(一)

        上篇博客大概的对Redis做了一个主要的了解.由于刚刚接触自己也不太明确.所以上篇博客写的乱七八糟的.这篇由于项目须要,学习了一下Redis和EJB集成. 如今脑子相对照较清晰了一些. 实现思 ...

  3. iOS优化策略

    之前写的一系列文章或者小经验一直没有时间去整理放在博客上,今天整理出来,之前是写在作业部落,语法是markdown,点击链接浏览,仅供参考,希望对你有帮助. https://www.zybuluo.c ...

  4. java获取class的几种方式

    以获取Hello.class为例 public class Hello { public static void main(String[] args) { // TODO Auto-generate ...

  5. 移动web开发适配rem

    移动的meta标签 <meta  name="viewport" content="width=device-width, initial-scale=1,user ...

  6. IDEA下搭建简单的SpringBoot工程应用

    (1)File->new,选择maven,创建一个空项目,直接next. (2)填写工程名,next. (3)填写项目名,next,创建一个基于maven的空Java项目. (4)在pom文件中 ...

  7. Opencv实现简易播放器

    实现了在MFC中显示图片,再要显示一个视频就是轻而易举的事了,本篇介绍使用Opencv制作一个简易的播放器,实现打开文件.暂停.继续播放.再次播放和总\当前帧数显示功能. 首先还是先看一下界面效果: ...

  8. Gym - 100342J:Triatrip(Bitset加速求三元环的数量)

    题意:求有向图里面有多少个三元环. 思路:枚举起点A,遍历A可以到的B,然后求C的数量,C的数量位B可以到是地方X集合,和可以到A的地方Y集合的交集(X&Y). B点可以枚举,也可以遍历.(两 ...

  9. 「LuoguP4047」 [JSOI2010]部落划分

    Description 聪聪研究发现,荒岛野人总是过着群居的生活,但是,并不是整个荒岛上的所有野人都属于同一个部落,野人们总是拉帮结派形成属于自己的部落,不同的部落之间则经常发生争斗.只是,这一切都成 ...

  10. [51nod 1129] 字符串最大值(kmp)

    传送门 题目大意 求一个字符串的前 缀出现次数乘以长度的最大值. 题解 暴力枚举每一个前缀求出现次数再乘以常数取最大 这样做会T几个点 看了老师的做法是任意前缀出现的次数,它的next也会出现这些次数 ...