display:table-cell可将元素设为类似于table的td一样的布局,在垂直居中、两行自适应布局、等高布局下有很高的利用价值

详见: http://www.zhangxinxu.com/wordpress/2010/10/%E6%88%91%E6%89%80%E7%9F%A5%E9%81%93%E7%9A%84%E5%87%A0%E7%A7%8Ddisplaytable-cell%E7%9A%84%E5%BA%94%E7%94%A8/

但当我们为其设置宽高时应当注意:根据w3c最新标准,宽高设置为百分比是不被建议的!

详情: https://m.aliyun.com/yunqi/ask/26125/

此文章介绍了不同宽度内容下的布局,但并未说明不同浏览器下的差异,经亲测在不同浏览器下差异颇大,故宽度不建议使用百分比!而高度设置百分比多是无效,因此也不建议使用。

table-cell笔记的更多相关文章

  1. IText 生成pdf,处理table cell列跨页缺失的问题

    /**     * 创建(table)PDF,处理cell 跨页处理     * @param savePath(需要保存的pdf路径)     * @param pmbs (数据库查询的数据)    ...

  2. LUA table学习笔记

    function printT( ... ) for i,v in ipairs(...) do print(i,v) end end t1={} t2={} t3={} table.insert(t ...

  3. js table的笔记,实现添加 td,实现搜索功能

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...

  4. table表格(笔记)

    <table class="table table-hover2 pick_carTable"> <thead> <tr class="bl ...

  5. Boostrap Table学习笔记

    最近要对项目上的table进行调整,让表格能够支持更多的操作,于是接触到了boostrapTable这个插件.研究了一天,记录下学习的内容. Boostrap Table可以支持表的分页及动态显示表的 ...

  6. Layui table 学习笔记

    templet:'<div>{{createrFormat(d.accounts.name)}}</div>' function createrFormat(o){ retur ...

  7. Guava学习笔记:Guava新集合-Table等

    Table 当我们需要多个索引的数据结构的时候,通常情况下,我们只能用这种丑陋的Map<FirstName, Map<LastName, Person>>来实现.为此Guava ...

  8. 集合-Table

    当我们需要多个索引的数据结构的时候,通常情况下,我们只能用这种丑陋的Map<FirstName, Map<LastName, Person>>来实现.为此Guava提供了一个新 ...

  9. C# 动态生成word文档 [C#学习笔记3]关于Main(string[ ] args)中args命令行参数 实现DataTables搜索框查询结果高亮显示 二维码神器QRCoder Asp.net MVC 中 CodeFirst 开发模式实例

    C# 动态生成word文档 本文以一个简单的小例子,简述利用C#语言开发word表格相关的知识,仅供学习分享使用,如有不足之处,还请指正. 在工程中引用word的动态库 在项目中,点击项目名称右键-- ...

  10. handsontable前端excel学习笔记

    暂时没有好的中文资料,大概找了三遍随便看看,之后重点研究其github 1.Handsontable 学习笔记-Methods 2. Handsontable通用方法 3.handsontable的核 ...

随机推荐

  1. Dalvik opcodes 查询smali语法大全

    原文链接:http://pallergabor.uw.hu/androidblog/dalvik_opcodes.html Vx values in the table denote a Dalvik ...

  2. 下拉刷新Listview(8.30)

    Android-PullToRefresh 1项目托管地址: https://github.com/bavariama1/Android-PullToRefresh 2 快速开始教程:https:// ...

  3. .NET CORE 2.0小白笔记(五):配置的热更新、配置的框架设计

    配置的热更新 什么是热更新:一般来说,我们创建的项目都无法做到热更新:即项目无需重启,修改配置文件后读取到的信息就是修改配置之后的 我们只需要吧项目中用到的IOptions改成IOptionsSnap ...

  4. 教你用squid做CDN把公司做到上市

    我们都知道CDN(内容分发网络)是用来给网站加速用的,通过在现有的Internet中增加一层新的网络架构,将网站的内容发布到最接近用户的网络的“边缘”,使用户可以就近取得所需的内容,以提高用户访问网站 ...

  5. amchart 图表设置

    官网:https://www.amcharts.com/demos/ 属性介绍:https://docs.amcharts.com/3/javascriptcharts/AmLegend 安装 bow ...

  6. [WebGL入门]二十五,点光源的光照

    注:文章译自http://wgld.org/,原作者杉本雅広(doxas),文章中假设有我的额外说明.我会加上[lufy:].另外,鄙人webgl研究还不够深入,一些专业词语.假设翻译有误,欢迎大家指 ...

  7. openWRT自学计划安排

    目标:充分理解openwrt的框架构成,能够在openwrt框架下实现:开发新程序,修改现有程序,修改内核,修改boot.为此,制定如下计划: 一.如何在openwrt上做开发 1.编译出一个BRCM ...

  8. 微信支付v3开发(6) 收货地址共享接口

    请看新版教程  微信支付开发(7) 收货地址共享接口V2 本文介绍微信支付下的收货地址共享接口的开发过程. 一. 简单介绍 微信收货地址共享,是指用户在微信浏览器内打开网页,填写过地址后,兴许能够免填 ...

  9. EasyUI分页(前台分页和后台分页)

    整理一下以前的总结: 分页包括前台分页和后台分页两种,针对数据量比较小的,比如说单位,角色等,可以使用前台分页,而针对日志文件这些,需要后台分页. 先说说前台分页吧: function pagerFi ...

  10. Gradle 构建工具

    参考文章: 作者:ghui 链接:https://www.zhihu.com/question/30432152/answer/48239946 来源:知乎 著作权归作者所有.商业转载请联系作者获得授 ...