通过div模拟table
参考:
https://css-tricks.com/complete-guide-table-element/
不要使用内联样式,但只是为了了解这里是如何去:
<section style="display: table;">
<header style="display: table-row;">
<div style="display: table-cell;"></div>
<div style="display: table-cell;"></div>
<div style="display: table-cell;"></div>
</header>
<div style="display: table-row;">
<div style="display: table-cell;"></div>
<div style="display: table-cell;"></div>
<div style="display: table-cell;"></div>
</div>
</section>
这里的一个简单的技巧是,如果你不需要的话,你甚至不需要表行元素.。一组显示:表单元格;元素是显示的子元素:表;元素将表现为它们都在同一行中。
您总是更改元素的显示属性,以获取表样式行为.
display: table /* <table> */
display: table-cell /* <td> */
display: table-row /* <tr> */
display: table-column /* <col> */
display: table-column-group /* <colgroup> */
display: table-footer-group /* <tfoot> */
display: table-header-group /* <thead> */
通过div模拟table的更多相关文章
- div模拟table,可实现左右高度同增长(html布局)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- div模拟table
<!DOCTYPE html><html><head><meta charset="UTF-8"><title>div模 ...
- jquery双向列表选择器DIV模拟版
前段时间项目需要用到双向列表选择,想直接用select,结果发现某些样式不支持,只好用div模拟了以下,功能基本实现能用了,需要其他功能自己加上,譬如列表里展示多列数据等. select版链接:htt ...
- 使用模拟Table解决span重叠问题
<div id="test"> <div > <span>adfafadsfadfa</span> <span style=& ...
- ie下div模拟的表格,表头表体无法对齐
现象:ie下,如果某个区域滚动显示表格内容(div模拟的table),表体出现滚动条的时候,会跟表头无法对齐. 解决方法:1.首先需要知道两个高度:表体最大高度height1.目前表体要显示的内容高度 ...
- div 模拟<select>事件
IE7 下,不能够自定义<select>/<option>的样式,所以为了方便起见,用div可以进行模拟 <!doctype html> <html> ...
- (转)Div和Table的区别
原文:http://www.cnblogs.com/lovebear/archive/2012/04/18/2456081.html Div与table的区别 1:速度和加载方式方面的区别 div 和 ...
- div模拟表格使用display
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...
- 转: Div与table的区别
1:速度和加载方式方面的区别 div 和 table 的差异不是速度,而是加载方式,速度只能是指网络速度,如果速度足够快,是没有差异的: div 的加载方式是即读即加载,遇到 <div> ...
随机推荐
- EM阅读资料
1,从最大似然到EM算法浅解 2,(EM算法)The EM Algorithm 3,数据挖掘十大算法----EM算法(最大期望算法) (番外)最大后验估计(MAP)
- SPFA中 正逆邻接表的建立
正邻接表的建立: 先定义一个结构体: struct node { int r,v,w,next; }Map[]; 每输入一组数据 就通过Add函数加入到邻接表中,上图已经说得很明白了,结合着下面的代码 ...
- 关闭和释放JDBC
今天在项目中看到一段代码, Connection conn = null; ResultSet rs = null; PreparedStatement pss = null; try { ...
- drawRect & layoutSubviews 调用时间
首先两个方法都是异步执行.layoutSubviews方便数据计算,drawRect方便视图重绘. layoutSubviews在以下情况下会被调用: 1.init初始化不会触发layoutSub ...
- python正则表达式例子说明
pattern = re.compile('<div.*?author">.*?<a.*?<img.*?>(.*?)</a>.*?<div.* ...
- 集合-字典(Lookup/SortedDictionary)
Lookup<TKey, TElement>非常类似于Dictionary<TKey, TValue>,但是把键映射在一个值集上. 必须调用ToLookup方法创建Lookup ...
- Mysql 技巧
order by条件: SELECT * FROM tablename WHERE id_one=27 OR id_two=27 ORDER BY CASE WHEN id_one=27 THEN t ...
- C++ Builder多线程编程技术经验谈(转)
源:C++ Builder多线程编程技术经验谈 线程之可行性 在很多情况下,可能需要为程序创建线程.这里给出其中一些可能性: (1)如果创建的是一个多文档接口(Multiple Document ...
- BNU OJ 51003 BQG's Confusing Sequence
二进制++高精度取模 #include<cstdio> #include<cstring> #include<algorithm> using namespace ...
- 伸展二叉树树(C#)
参考过好几篇关于将伸展树的代码,发现看不懂.看图能看懂原理.就尝试自己实现了下. 自顶向上的算法. using System; using System.Collections.Generic; us ...