cell

display:table-cell属性简介 display：table-cell ；会使元素表现的类似一个表格中的单元格 td ，利用这个特性可以实现文字的垂直居中效果。同时它也会破坏一些CSS属性，使用 table-cell 时最好不要与 float 以及 position: absolute 一起使用，设置了 table-cell 的元素对高度和宽度高度敏感，对 margin 值无反应，可以响应 padding 的设置，表现几乎类似一个td元素。 小结： 1. 不要与 float：left; position:absolute; 一起使用 2. 可以实现大小不固定元素的垂直居中 3. margin 设置无效，响应 padding 设置 4. 对高度和宽度高度敏感 5. 不要对display：table-cell使用百分比设置宽度和高度 下面介绍几个 table-cell 的应用 1. 高度不固定内容水平垂直居中 文字水平垂直居中 < style > .table-wrap { display : table-cell ; height : 200 px ; width : 100 px ; padding : 20 px ; vertical-align : middle ; text-align : center ; border : 1 px solid red ; }

http://www.cnblogs.com/clumiere/p/4506252.html display:table-cell的几种应用 在使用Bootstrap的过程中，发现很多地方都应用了display:table-cell，决定好好研究一下table-cell的用法。 display:table-cell简述 display:table-cell是指让元素以表格单元格的形式来表现。目前所有主流浏览器都支持display:table-cell。 display:table-cell的浏览器兼容性。 使用了display:table-cell的元素设置margin值无效，但padding值是有效的，所以如果要在设置了table-cell的元素上应用margin，需要再包裹一层元素。另外如果设置了display:table-cell的元素的父元素不是display:table-row，父元素的父元素不是display:table，那么浏览器会自动创建相应的匿名元素，使得DOM层次结构符合table/inline-table>table-row>table-cell三层嵌套关系，这就是”匿名创建表格元素规则”。 利用display:table-cell创建等高布局 table表格中每一行单元格都等高，设置了display:table-cell的一组元素也有同样的特点。

by zhangxinxu from http://www.zhangxinxu.com 本文地址： http://www.zhangxinxu.com/wordpress/?p=1187 一、display:table-cell属性简述 display:table-cell属性指让标签元素以表格单元格的形式呈现，类似于td标签。目前IE8+以及其他现代浏览器都是支持此属性的，但是IE6/7只能对你说sorry了，这一事实也是大大制约了display:table-cell属性在实际项目中的应用。 我们都知道，单元格有一些比较特别的属性，例如元素的垂直居中对齐，关联伸缩等，所以display:table-cell还是有不少潜在的使用价值的，虽说IE6/7不支持此属性，但是幸运的是，IE6/7一些乱糟糟的属性与渲染，我们可以其他方法实现同样或是类似的效果。 与其他一些display属性类似，table-cell同样会被其他一些CSS属性破坏，例如float, position:absolute，所以，在使用display:table-cell与float:left或是position:absolute属性尽量不用同用。设置了display:table-cell的元素对宽度高度敏感，对margin值无反应，响应padding属性，基本上就是活脱脱的一个td标签元素了。 二、display

display 属性规定元素应该生成的框的类型,用的最多的就是display:block;显示 display:none;隐藏。 下面是所有值的用法描述。display本身意思是“显示、阵列”的意思值 描述 none 此元素不会被显示。 block 此元素将显示为块级元素，此元素前后会带有换行符。 inline 默认。此元素会被显示为内联元素，元素前后没有换行符。 inline-block 行内块元素。（CSS2.1 新增的值） list-item 此元素会作为列表显示。 run-in 此元素会根据上下文作为块级元素或内联元素显示。 table 此元素会作为块级表格来显示（类似 <table>），表格前后带有换行符。 inline-table 此元素会作为内联表格来显示（类似 <table>），表格前后没有换行符。 table-row-group 此元素会作为一个或多个行的分组来显示（类似 <tbody>）。 table-header-group 此元素会作为一个或多个行的分组来显示（类似 <thead>）。 table-footer-group 此元素会作为一个或多个行的分组来显示（类似 <tfoot>）。 table-row 此元素会作为一个表格行显示（类似 <tr>）。 table-column-group 此元素会作为一个或多个列的分组来显示（类似 <colgroup>）。

I am trying to add an AdMob ad to a table view. I would like it to show up in every 10th cell. (Eg. like how it is in the Free version of the Reddit App if you have it). I tried to follow the AdMob documentation but I didn't have any luck and I'm sure there is something I am missing. Could anyone shine some light on a simple way to do this? Thanks! I've used code basically like this: int row = [indexpath row]; if (0 == (row % 10)) { // or 9 == if you don't want the first cell to be an ad! static NSString *MyIdentifier = @"AdCell"; cell = [tableView dequeueReusableCellWithIdentifier

display:table-cell自适应布局下连续单词字符换行 by zhangxinxu from http://www.zhangxinxu.com 本文地址： http://www.zhangxinxu.com/wordpress/?p=2161 一、过年回家，快刀乱麻，直入主题 之前有 几次 提到了使用 display:table-cell 实现强大的任意尺寸元素的自适应布局（都藏在长长文章之中）。这里开篇再次提一下，希望能将该技术普及下去。 典型的双栏布局类名使用如下： fix l cell 该类名去来自我自己整的CSS基本样式库 – zxx.lib.css 套用HTML显示则为： <div class="fix"> <div class="l"></div> <div class="cell"></div> </div> 这几个类名对应CSS为： .fix{*zoom:1;}.fix:after{display:block; content:"clear"; height:0; clear:both; visibility:hidden;} .l{float:left;} .cell{display:table-cell; *display:inline-block; width:2000px; *width:auto;} 这种方式实现的自适应布局，元素宽度无需定值

我已经沉浸在周末前一天的愉快氛围里无法自拔。 1、简介 今天来学习一下display的一个值， table-cell W3C 上面关于这个属性值的解释 是它会作为一个表格单元格显示（类似td和th） ie兼容性：支持到 ie8+ 注意：table-cell 在使用的时候容易被其他一些css属性所影响，对元素的高度宽度非常敏感，margin值对其不起作用，但是可以设置其padding值。 2、功能 （1） display:table-cell与大小不固定元素的垂直居中 ~ ~~~~~~~ 对于两个宽度和高度不同的图片，我想达到的效果是 为此，我在两个img的外层分别包了一个div，html代码如下： <div> <a href="http://placehold.it"><img src="http://placehold.it/150X150"></a> </div> <div> <a href="http://placehold.it"><img src="http://placehold.it/150X100"></a> </div> 一开始 效果如下： 我 来 改造 一下，通过给外层div加style样式，具体css代码如下： div { width: 200px; height: 200px; border: 1px solid red; display: table

转自：http://www.cnblogs.com/StormSpirit/archive/2012/10/24/2736453.html 抛弃table的兼容性、seo、加载等与本文无关的内容不谈，只看属性，那么table就两个特点： 1.同行等高。 2.宽度自动调节。 那么table-cell (ie6、ie7不支持) 是不是具备这个特点呢？答案是yes，为什么呢？css中有一个有意思的规则“创建匿名表格元素”。拿table-cell来扯，就是，当某个元素被设置为display:table-cell的时候，如果她的父节点不是display：table-row，爷爷节点不是display:table，那么下面就是见证奇迹的时候，这个儿子生出了他的爸爸和爷爷（浏览器会自动创建者两个匿名盒对象）虽然你找不到你的father 和 grandfather，但这确实发生了。 那么下面来看几种情况，帮助我们了解这个不可思议的事情。我先编写代码如下： <style type="text/css"> div{padding:10px 0;} .classtd, td{height:34px; padding:10px; margin:10px; border:1px solid #ccc; vertical-align:middle;} .classtd{display:table-cell;

display:table的CSS声明能够让一个HTML元素和它的子节点像table元素一样。使用基于表格的CSS布局，使我们能够轻松定义一个单元格的边界、背景等样式，而不会产生因为使用了table那样的制表标签所导致的语义化问题。 网页元素应用上那些与表格相关的display属性值后，能够模仿出与表格相同的特性。我将会在该文中给大家演示这种方法给CSS布局带来的巨大影响。 使用CSS表格 CSS表格能够解决所有那些我们在使用绝对定位和浮动定位进行多列布局时所遇到的问题。例如，“display:table;”的CSS声明能够让一个HTML元素和它的子节点像table元素一样。使用基于表格的CSS布局，使我们能够轻松定义一个单元格的边界、背景等样式，而不会产生因为使用了table那样的制表标签所导致的语义化问题。 在深入了解这种方法之前，让我们先来写份HTML文档实例： <div id="wrapper"> <div id="main"> <div id="nav">? navigation column content…</div> <div id="extras">? news headlines column content…</div> <div id="content">? main article content…</div> </div> </div>

在web中，我们动态添加DOM，可以用jQuery的方法，很简单。在微信小程序中怎么实现下面这么需求。 其中，里程数代表上一行到这一行地方的距离（这个不重要）；要实现的就是点击增加途径地，就多一行，删除途径地，就少一行。 分析：添加的和删除的是同样的结构，只是数量不一样，所以考虑循环，用列表表示，增加就往这个列表push一个，删除就从列表pop一个。 主要代码如下： < view class = " weui-cell weui-cell_input " > < view class = " weui-cell__hd " > < view class = " weui-label rui-justify " > < text space = " ensp " > 出 发 地 </ text > </ view > </ view > < view class = " weui-cell__bd " > < input class = " weui-input " name = " beginAddress " bindinput = " inputedit " data-obj = " info " data-item = " beginAddress " value = " {{info.beginAddress}} " placeholder = " 请输入出发地 "