財政部關務署-洪仕閔

網站

財政部關務署

姓名

洪仕閔

檢測日期

2018-04-20

檢測裝置

iPhone 6

作業系統 與 瀏覽器版本

ios11

解析度(手機螢幕)

375x667 pixels

是否會自動跳入行動版欄位?

壞掉的連結


跑版(影響閱讀)問題

首頁>認識關務署>機關位置
解法回文連結
首頁>通關服務>電話傳真語音服務>各關受理電傳申請退還押款、電話及傳真機號碼一覽表
解法回文連結
首頁>其他資訊>便民服務>出版品>銷售地點資訊
解法回文連結
首頁>通關服務>反傾銷措施>調查中案件
解法回文連結
表格被吃掉了~


解法回文連結
首頁>通關服務>反傾銷措施>現行課徵項目
首頁>其他資訊>便民服務>出版品>銷售出版品及出售價格
表格閱讀不易而且跑板了~


首頁 > 網站導覽
解法回文連結
首頁 > 其他資訊 > 首頁項目 > 會員專區
文字顯示不全


無法操作的網頁元素(如按鈕不能按、選單不能選等)

出現亂碼

不能用的外掛程式(Flash、ActiveX、Applet、Silverlight、…)

網站載入緩慢(相對一般網站)

閱讀模式

不可以用

其他(無法判斷屬於以上那個分類的都放在這邊)

對此網站建議(非程式問題皆放置這裡)

問題:

可能原因:

表格帶了固定寬度的屬性

原始程式:

(範例)
位置: view-source:https://web.customs.gov.tw/News_Content.aspx?n=C9DFD0802883A261&sms=433989695AFAB3A8&s=357E97CCF2E7C575:308
找到下面這段

公車路線表</strong></h3> <table border="2" style="width: 626.69px; height: 250px">

建議修改:

移除table的width屬性

公車路線表</strong></h3> <table border="2" style="height: 250px">

補充

結尾(選填,可增加網站建議)

問題:

可能原因:

表格帶了固定寬度的屬性

原始程式:

位置:https://web.customs.gov.tw/css/global.css
由於css被編譯過,故無法提供行數
請找到table的屬性設定

table{border-collapse:collapse;border-spacing:0;}

建議修改:

加上width: 100% !important

table{border-collapse:collapse;border-spacing:0;width:  100% !important;}

補充

結尾(選填,可增加網站建議)

問題:

可能原因:

無問題,表格可以左右滑動,不處理

原始程式:

建議修改:

補充

結尾(選填,可增加網站建議)

問題:

可能原因:

奇怪的css設定

原始程式:

位置:https://web.customs.gov.tw/css/global.css
css被壓縮過,故找到以下位置

.table-rwd tr{display:block; border:1px solid #ddd;margin-top:10px;}
@media screen and (max-width: 560px)
.table-rwd td {
    text-align: left;
    font-size: 15px;
    overflow: hidden;
    width: 100%;
    display: block;
@media screen and (max-width: 560px)
.table-rwd.table-bordered td, .table-rwd.table-bordered th, .table-rwd.table-bordered {
    border: 0; 
    background-color: transparent !important; 
}
@media screen and (max-width: 560px)
.table-rwd tr.tr-only-hide {
    display: none !important;

建議修改:

移除table-rwd的display屬性

.table-rwd tr{/* display:block; */border:1px solid #ddd;margin-top:10px;}```

移除@media screen and (max-width: 560px).table-rwd td的display

@media screen and (max-width: 560px)
.table-rwd td {
    text-align: left;
    font-size: 15px;
    overflow: hidden;
    width: 100%;
    /* display: block; */

移除這個的所有屬性

@media screen and (max-width: 560px)
.table-rwd.table-bordered td, .table-rwd.table-bordered th, .table-rwd.table-bordered {
    /* border: 0; */
    /* background-color: transparent !important; */
}

移除

加入overflow屬性

.area-figure.album .ct .p, .area-essay.message .ct .p, .base-module-area .area-essay.link .ct .p, .base-page-area .area-essay.link .ct .p, .area-form.vote .ct .p, .area-figure.album02 .ct .p, .area-essay.active .ct .p, .area-essay.page-caption-p>.bg-drop-layout>.in>.ct .p, .area-essay.page-caption-p>.in>.ct .p, .area-essay.page-caption-label-p .ct .p, .area-essay.page-essay .ct .p, .area-essay.page-img-caption-p .ct .p, .area-figure.page-figure .ct .p, .area-figure.page-img-figcaption-p .ct .p, .area-figure.page-img-label-p .ct .p, .area-figure.page-img-p .ct .p {
    margin: 5px 0;
    overflow: auto;
}

移除 display

@media screen and (max-width: 560px)
.table-rwd tr.tr-only-hide {
    /* display: none !important; */

補充

看起來會好一點,且某些表格可以左右滑動,但需重新設計


結尾(選填,可增加網站建議)

問題:

可能原因:

有強制不換行設定

原始程式:

位置:https://web.customs.gov.tw/css/global.css
css被壓縮過,請找到一下設定

.group-list.sitemap>.bg-drop-layout>.in>.hd h3, .group-list.sitemap>.in>.hd h3 {
    padding-bottom: 8px;
    border-bottom: 1px solid #b6b6b6;
    margin-bottom: 8px;
}

建議修改:

加入換行設定

.group-list.sitemap>.bg-drop-layout>.in>.hd h3, .group-list.sitemap>.in>.hd h3 {
    padding-bottom: 8px;
    border-bottom: 1px solid #b6b6b6;
    margin-bottom: 8px;
    white-space: normal;
}

補充

結尾(選填,可增加網站建議)

問題:

可能原因:

表格資訊太多

原始程式:

位置:https://web.customs.gov.tw/css/global.css
css被壓縮過,找到以下設定

.area-figure.album .ct .p, .area-essay.message .ct .p, .base-module-area .area-essay.link .ct .p, .base-page-area .area-essay.link .ct .p, .area-form.vote .ct .p, .area-figure.album02 .ct .p, .area-essay.active .ct .p, .area-essay.page-caption-p>.bg-drop-layout>.in>.ct .p, .area-essay.page-caption-p>.in>.ct .p, .area-essay.page-caption-label-p .ct .p, .area-essay.page-essay .ct .p, .area-essay.page-img-caption-p .ct .p, .area-figure.page-figure .ct .p, .area-figure.page-img-figcaption-p .ct .p, .area-figure.page-img-label-p .ct .p, .area-figure.page-img-p .ct .p {
    margin: 5px 0;
}

建議修改:

加入overflow

.area-figure.album .ct .p, .area-essay.message .ct .p, .base-module-area .area-essay.link .ct .p, .base-page-area .area-essay.link .ct .p, .area-form.vote .ct .p, .area-figure.album02 .ct .p, .area-essay.active .ct .p, .area-essay.page-caption-p>.bg-drop-layout>.in>.ct .p, .area-essay.page-caption-p>.in>.ct .p, .area-essay.page-caption-label-p .ct .p, .area-essay.page-essay .ct .p, .area-essay.page-img-caption-p .ct .p, .area-figure.page-figure .ct .p, .area-figure.page-img-figcaption-p .ct .p, .area-figure.page-img-label-p .ct .p, .area-figure.page-img-p .ct .p {
    margin: 5px 0;
    overflow: auto;
}

補充

表格內容太多,先以此方式調整

結尾(選填,可增加網站建議)