作者cqwt (tony)
看板Web_Design
标题Re: [问题] table 列合并语法
时间Tue Nov 6 05:03:32 2018
原 PO:
跟你内文的理解没关联。
这几位可能比较年轻,没遇上早期的情况,或是最近才接触相关的东西。
以前 CSS 不完全甚至还没有的时候,纯 Html 是由上到下、照规范渲染的,block 的东西你想要左右并排基本不可能,inline 的东西你想上下排也没办法。
任何定位也都没有。现在做定位可能会用 padding、position 之类的,但这是 CSS,那还没有 CSS 的时候怎麽办呢?
没办法定位的话,要是想做一个有背景、有图有文有圆角按钮的网站怎麽办呢?
那就是利用表格的天性了。
就像堆积木一样,每一格都是网站的一小部份,把整个网站堆起来。
举个例子,现在要做一个圆角矩形方块背景的文字区块,会在 text 的外面用 border radius。
但以前没这东西,我们会用 table 去做出一个 3x3的表格,左上、左下、右上、右下填充圆角的图片,上下左右是一个方形的图片、中间就是 text 本身。
用这样的方式去堆出一个圆角矩形。
在 IE 还不支援透明 png 的时候,还曾出现一格 1px 去堆出圆角的疯狂行为。
在 IE 还不支援透明 png 的时候,还曾出现一格 1px 去堆出圆角的疯狂行为。
然後 table 本身就可以再包含 table,你可以想像能这样一层包一层的堆出有很多设计元素的网站。
如果你用过 PS 之类的切片工具就会知道,切完输出的东西就是一堆图块,然後你按原本的顺序填进 table 中,就会变成你原本设计的网站了。
但其实 table 本身不该这样用,html 设计上也不是这用意,html 不该用於任何样式用途。但早期为了好看没办法。
CSS 2 的时候,还有一些我们想要的东西办不到,还是会有很多人用 html 做样式用途,或是用不合规范的方式去做,到 CSS 3 的时候基本就完全没必要了。
你文中说 table 填 ul ol 再用 CSS 做 layout 这段我没看懂,什麽情况要这样用?
用 ul li 再 float 做横向 nav 以前很常见,现在也满多的,但这其实不是 layout 用意,ul 这样用是有意义的。
中间的转换期很多都是因为 CSS 规范制定了,但浏览器还没实作,或是因为早期的 IE 太特例独行,导致很多非 html 规范意图的作法,久而久之很多不是那麽在意这些东西的人就一直用不正确、不严谨的方式实作。
有一阵子凡是在写 html 教学的网站都会特别跟大家说「别再用 html 的 XXX 去做 XXX,请用 CSS 的 XXX」。
※ 引述《ppnow (no ways)》之铭言:
: 竖山
: 我是推文里发问为何W3S不建议使用
: HTML做table的新手,感谢几位的指导。
: HTML做table的新手,感谢几位的指导。
: W3S内的说明跟xd大讲的很接近,
: 是指不建议用HTML table “layout“,
: (题外话大家是翻译成排版还是布局?)
: 网页来源
: https://www.w3schools.com/html/html_layout.asp
: 截图如下
: http://i.imgur.com/8DkoVuo.jpg
: http://i.imgur.com/WrI9JIm.jpg
: 我想了解的是,网站上的table基本上都是
: 要经过layout的,所以习惯的做法是在
: HTML table的ul ol li输入资料,然後再以
: CSS style来layout这样吗?
: 例如把直向列表用float改成横向,类似nav
: 列表,似乎是目前流行的做法
: 还是有其他主流做法?
: 新手发问可能很蠢很简单,或问的不好,
: 请大大不吝指导,谢谢
: -----
: Sent from JPTT on my Xiaomi Redmi 5.
--
--
--
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 118.160.52.68
※ 发信站: 批踢踢实业坊(ptt.cc), 来自: 118.160.52.68
※ 文章网址: https://webptt.com/cn.aspx?n=bbs/Web_Design/M.1541451815.A.F2A.html
※ 编辑: cqwt (118.160.52.68), 11/06/2018 05:06:12
※ 编辑: cqwt (118.160.52.68), 11/06/2018 05:07:39
1F:推 pkro12345: 推11/06 05:06
※ 编辑: cqwt (118.160.52.68), 11/06/2018 05:27:18
※ 编辑: cqwt (118.160.52.68), 11/06/2018 06:00:28
2F:推 ccw1210: 推 11/06 09:09
3F:推 nottt: 历史课,在css到css2的则是大flash时代 11/06 11:34
4F:推 cuxy6705: 太神了 11/06 13:39
5F:→ ppnow: 太棒的历史说明,谢谢。我就是想知道这些,不过知识尚浅还 11/06 14:18
6F:→ ppnow: 无法完全吸收。我不年轻了只是喜爱学习,哈哈 11/06 14:18
7F:推 ppnow: 想一想我在念书的时候,有看过1px堆圆角的图形,只是当时不 11/06 14:35
8F:→ ppnow: 懂HTML。所以现在CSS3,基本上就完全可切开了,HTML5写资料 11/06 14:35
9F:→ ppnow: ,CSS3做样式。 11/06 14:35
10F:推 j355066: 推 11/06 18:33
11F:推 shter: 推,十年前做圆角 Button 真的是这样堆出来的 11/06 22:09
12F:→ shter: 不过还是很怀念那个做法,直接换 background-image 换造型 11/06 22:12
13F:推 pandaz79418: 推一个 11/07 01:09
14F:推 zased: 感谢分享。我待两家企业都是用table排版,有天惊觉div跟css 11/07 09:22
15F:→ zased: 就可以就自己偷偷全部改写了 11/07 09:22
16F:→ xdraculax: 说起来就觉得好笑,古早圆角困难,大家都爱搞圆角,觉 11/07 10:23
17F:→ xdraculax: 得圆角就是高上大,後来圆角简单,大家又不爱圆角,说 11/07 10:23
18F:→ xdraculax: 简约才是时尚,现在圆角又有点死灰复燃了,FB没底线的 11/07 10:23
19F:→ xdraculax: 圆,时尚真难懂 11/07 10:23