繁體瀏覽工具設為首頁收藏本站
 找回密碼 或 安全提問
 註冊
|註冊|登錄

伊莉討論區

搜索
尊貴會員無限看帖不用回覆伊莉需要你的贊助和支持認識好友、聊天，分享生活趣事
伊莉討論區 › 論壇 › 電腦資訊 › 電腦設計技術交流 › 網頁設計交流 › RWD網站下的table
神奇寶貝波多野結柯南中文中出mg國中
七龍珠blazblue捷克juq 358廢材小姐miaa 799中學
休閒聊天興趣交流學術文化旅遊交流飲食交流家庭事務PC GAMETV GAME
熱門線上其他線上感情感性寵物交流家族門派動漫交流貼圖分享BL/GL
音樂世界影視娛樂女性頻道潮流資訊BT下載區GB下載區下載分享短片
電腦資訊數碼產品手機交流交易廣場網站事務長篇小說體育運動時事經濟
上班一族博彩娛樂

(4月新番)[繁]魔王學
捷運OL小姐姐
[繁]怪物轉生 Re:Mons

HAN HAN 水果攤的少女
(4月新番)[繁]Re：Mon
[繁]轉生為第七王子，
網頁設計交流Flash 設計交流
返回列表發新帖

查看: 9441|回復: 0
打印上一主題下一主題

[求助]RWD網站下的table[複製鏈接]

ren1244

Rank: 1

帖子
575
積分
196 點
潛水值
14681 米
樓主
發表於 2018-6-14 04:06 AM|顯示全部樓層
若對尊貴或贊助會員有任何疑問，歡迎向我們查詢。我們的即時通或MSN: admin@eyny.com
可以考慮設計成下面這樣
再利用 display:none 隱藏不顯示的部分


完整的 html 跟 css
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <meta charset="utf-8">
  5.         <title>RWD</title>
  6. </head>
  7. <body>
  8.         <table>
  9.                 <tr class="img-rwd-1">
  10.                         <td class="ex-1" colspan="3"><img src="https://svgshare.com/i/72t.svg"></td>
  11.                 </tr>
  12.                 <tr>
  13.                         <td rowspan="4" class="img-rwd-2"><img src="https://svgshare.com/i/72t.svg"></td>
  14.                         <td class="ex-2">1</td>
  15.                         <td class="ex-2">a</td>
  16.                 </tr>
  17.                 <tr>
  18.                         <td class="ex-2">2</td>
  19.                         <td class="ex-2">b</td>
  20.                 </tr>
  21.                 <tr>
  22.                         <td class="ex-2">3</td>
  23.                         <td class="ex-2">c</td>
  24.                 </tr>
  25.                 <tr>
  26.                         <td class="ex-2">4</td>
  27.                         <td class="ex-2">d</td>
  28.                 </tr>
  29.         </table>
  30.         <style type="text/css">
  31.                 table,tr,td{
  32.                         border:1px solid;
  33.                 }
  34.                 table{
  35.                         border-collapse: separate;
  36.                         border-spacing:10px;
  37.                         width:100%;
  38.                 }
  39.                 td{
  40.                         text-align:center;
  41.                 }
  42.                 .ex-1{
  43.                         width:100%;
  44.                 }
  45.                 .ex-2{
  46.                         width:50%;
  47.                 }
  48.                 img{
  49.                         width:320px;
  50.                 }
  51.                 .img-td-1{
  52.                         width:100%;
  53.                 }
  54.                 @media only screen and ( min-width : 900px){
  55.                         .img-rwd-1{
  56.                                 display:none;
  57.                         }
  58.                 }
  59.                 @media not screen and ( min-width : 900px){
  60.                         .img-rwd-2{
  61.                                 display:none;
  62.                         }
  63.                 }
  64.         </style>
  65. </body>
  66. </html>
複製代碼
...
瀏覽完整內容，請先 註冊 或 登入會員
伊莉影片

使用道具檢舉

返回列表發新帖
高級模式
BColorImageLinkQuoteCodeSmilies
您需要登錄後才可以回帖 登錄 | 註冊

Powered by Discuz!

© Comsenz Inc.

重要聲明：本討論區是以即時上載留言的方式運作，對所有留言的真實性、完整性及立場等，不負任何法律責任。而一切留言之言論只代表留言者個人意見，並非本網站之立場，用戶不應信賴內容，並應自行判斷內容之真實性。於有關情形下，用戶應尋求專業意見(如涉及醫療、法律或投資等問題)。 由於本討論區受到「即時上載留言」運作方式所規限，故不能完全監察所有留言，若讀者發現有留言出現問題，請聯絡我們。有權刪除任何留言及拒絕任何人士上載留言，同時亦有不刪除留言的權利。切勿上傳和撰寫 侵犯版權(未經授權)、粗言穢語、誹謗、渲染色情暴力或人身攻擊的言論，敬請自律。本網站保留一切法律權利。
回頂部