Re: [問題] table 列合併語法

看板Web_Design作者cqwt (tony)時間5年前 (2018/11/06 05:03)推噓9(9推 0噓 10→)

留言19則, 10人參與討論串3/3 (看更多)

原 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://www.ptt.cc/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

推

pkro12345

11/06 05:06, 5年前 , 1^F

11/06 05:06, 1^F

※ 編輯: cqwt (118.160.52.68), 11/06/2018 05:27:18 ※ 編輯: cqwt (118.160.52.68), 11/06/2018 06:00:28

推

ccw1210

11/06 09:09, 5年前 , 2^F

11/06 09:09, 2^F

推

nottt

11/06 11:34, 5年前 , 3^F