作者s9250123 (Adun)
看板Web_Design
标题[问题] 表格RWD使用div+css写法
时间Wed Feb 28 15:10:18 2018
最近在练习写表格真的觉得很头大....
尤其又要转换手机版样式,边框线常常这边多一条那里少一条的...有请各位经验多的大大分享一些心得写法QQ
不过目前遇到比较苦手的部份是表格head
如图(宽萤幕版本)
https://i.imgur.com/3y6PEFa.jpg
Q1. 绿色1、2列在手机版呈现会如下图,拆成两个区块的表格(表格head会独立再显示出现)
https://i.imgur.com/XEHfcvA.jpg
_
这部份原本尝试用data-title+伪元素去写,
但发现这样储存格的区块就要多写margin或padding去预留上方表头的位置,资料一多似乎有点麻烦....orz
所以想上来问问有没有更简洁的写法呈现~~
_
Q2. 合并储存格的部份要怎麽让他写成合并的样子呢?(目前是写成个别储存格不显示框线=还是塞在右2的储存格里)
以上求解感谢各位大大!小妹先跪惹Q_Q
-----
Sent from JPTT on my iPhone
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 223.140.157.32
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1519801821.A.AA8.html
1F:推 a65162: 你可以研究怎麽用 jQuery FooTable 的插件 看看能不能解决 02/28 15:32
2F:→ a65162: 你的问题 02/28 15:32
3F:→ Rplus: Google: RWD table 03/01 01:23
4F:推 WayneFu: 如果使用的表格不复杂 我整理了一个轻量外挂的程式码 03/01 06:24
6F:→ miau: 如果你的表格真的如你所示的这麽单纯,应该也可以这样解XD 03/01 15:05
8F:推 a700evolve: display: flex / grid 05/17 03:04