“模板內文字描述01”的表格問題


“模板內文字描述01”的表格問題
1. “模板內文字描述01”內插入表格後右邊的部分在eBay詳情頁顯示不完整

這是因為表格太寬,所以阻礙了其他所有內容的顯示,表格的最佳寬度為750px,超過750px就可能無法完全顯示

如果不能直接在插入表格的地方修改寬度的話,可以點左上角的“原始碼”,找到table元素,在width的部分把寬度設置為750px,記得要在“原始碼”的狀態下點擊“確認”才能成功保存。

2. 表格內混用了文字和圖片,最後的結果不是自己設計的那樣?

由於使用了像素來控制表格的寬度和表格內單元格的寬度,所以當操作員對表格、單元格、文字和片尺寸的把握失當的時候,最後的結果不一定是操作員想要的。

此時推薦使用百分比來控制所有的尺寸。

涉及到的元素:表格、單元格、文字、圖片

如果把表格當做一個大容器來看的話,則裏面的單元格就是裝在大容器裏面的一個一個小容器,而文字和圖片則是裝在單元格裏面的一個一個小物件。

在設計每一個元素的百分比尺寸的時候,要注意它所在的上一級元素的尺寸。

-------------------------------------------------------------------------------------

將表格的尺寸設計為100%,則該表格會佔據它所在的頁面寬度的100%

--如果該頁面的寬度為800像素(SoldEazy模板的電腦版寬度),則查看電腦版模板的時候,會發現該表格的尺寸為800像素。

--如果該頁面的寬度為300像素(SoldEazy模板的手機版寬度),則查看電腦版模板的時候,會發現該表格的尺寸為300像素。

  假設該表格有兩個豎列,左列尺寸為30%,右列尺寸為70%

--如果該表格的寬度為800像素,則左列寬度為240像素,右列寬度為560像素

--如果該表格的寬度為300像素,則左列寬度為90像素,右列寬度為210像素

  假設左列有個單元格,裏面的圖片寬度設計為100%,高度留空

--如果該單元格寬度為240像素,則該圖片寬度為240像素,圖片大小會等比例縮放

--如果該單元格寬度為90像素,則該圖片寬度為90像素,圖片大小會等比例縮放

-------------------------------------------------------------------------------------將表格的尺寸設計為60%,則該表格會佔據它所在的頁面寬度的60%

--如果該頁面的寬度為800像素(SoldEazy模板的電腦版寬度),則查看電腦版模板的時候,會發現該表格的尺寸為480像素。

--如果該頁面的寬度為300像素(SoldEazy模板的手機版寬度),則查看電腦版模板的時候,會發現該表格的尺寸為180像素。

  假設該表格有兩個豎列,左列尺寸為30%,右列尺寸為70%

--如果該表格的寬度為480像素,則左列寬度為144像素,右列寬度為336像素

--如果該表格的寬度為180像素,則左列寬度為54像素,右列寬度為126像素

  假設左列有個單元格,裏面的圖片寬度設計為100%,高度留空

--如果該單元格寬度為144像素,則該圖片寬度為144像素,圖片大小會等比例縮放

--如果該單元格寬度為54像素,則該圖片寬度為54像素,圖片大小會等比例縮放


如果不按照百分比,而是按照像素來設計的話,表格、單元格、文字、圖片的尺寸全部都是定死的,無法根據實際情況進行適應。

***Fin***



文章ID編號: 235
已發佈: Wed, May 9, 2018 11:10 AM
最後更新: Wed, May 9, 2018 11:10 AM
已發佈: Holistic Tech [info@holistictec.com]

在線URL: https://www.soldeazy.com/support/article.php?id=235