勞動部-穆邦妮

[bonniemu]

網站

中華民國勞動部

姓名

穆邦妮

檢測日期

2018-04-02

檢測裝置

iphone 6

作業系統 與 瀏覽器版本

ios 11.2

解析度（手機螢幕）

375x667 pixels

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

是

壞掉的連結

無

---

跑版（影響閱讀）問題

1. 首頁>本部簡介>聯絡資訊
   交通路線(地圖+搭乘方式)地方被卡掉了，無法發大或縮小頁面。解法連結
   (圖一)以下為手機板
   
   (圖二)以下為正常的網頁板
   

---

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

無

出現亂碼

無

不能用的外掛程式（Flash、ActiveX、Applet、Silverlight、…）

無

網站載入緩慢（相對一般網站）

無

閱讀模式

有些無法有些可以

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

首頁>業務專區>工作規則>工作規則參考手冊展開
出現不明指示物(手機板與網頁板都有問題)
(圖一)solution

(圖二)正常指示如下圖

---

2. 首頁>相關連結>國外勞工業務網站>國外勞工運動與工會組織
   輕微跑版，但不影響觀看內容
   (圖一)手機板solution
   
   (圖二)正常網頁板
   

---

3.首頁>重大政策>施政績效
此頁輕微跑版(無法放大/縮小解決)，但不影響觀看內文。
(圖一)以下為手機板

(圖二)以下為正常的網頁板

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

1. 勞動部>民意信箱>操作常見問題
   沒有選取頁碼過後的痕跡，且通常會有下一頁或上一頁的選項
   

[ChaoWen]

@bonniemu

交通路線(地圖+搭乘方式)地方被卡掉了，無法發大或縮小頁面。

(圖一)以下為手機板

問題：

表格突出

可能原因：

圖片寬度寫死造成表格邊界超出

原始程式：

<img style="width: 500px; height: 498.4615384615385px;" src="/media/3810815/map03.jpg?width=500&amp;height=498.4615384615385" alt="" data-id="32212">

建議修改：

<img style="width: 100%; height:100%;" src="/media/3810815/map03.jpg?width=500&amp;height=498.4615384615385" alt="" data-id="32212">

補充

建議嵌入google map.
ref

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

[ChaoWen]

@bonniemu

輕微跑版，但不影響觀看內容

問題：

排版不佳

可能原因：

寫死寬度沒設min-width

原始程式：

<td width="1%" align="center" valign="middle">1</td>

建議修改：

add min-width

<td width="1%" align="center" valign="middle" style="
    min-width: 30px;
">1</td>

補充

建議使用 <ol>
ref

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

[ChaoWen]

此頁輕微跑版(無法放大/縮小解決)，但不影響觀看內文。

(圖一)以下為手機板

問題：

圖片突出

可能原因：

除片寬度寫死

原始程式：

<img style="width: 500px; height: 375px;" src="/media/3809670/投影片1.jpg?width=500&amp;height=375" alt="" data-id="25984">

建議修改：

圖片寬高改responsive 或是重寫

補充

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

[ChaoWen]

出現不明指示物(手機板與網頁板都有問題)

問題：

被藏起來了

可能原因：

overflow: hidden;

原始程式：

code

.ac-container article ul {background: rgba(255, 255, 255, 0.5);margin-top: -1px;overflow: hidden;height: 0px;position: relative;/* z-index: 10; */-webkit-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;-moz-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;-o-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;-ms-transition: height 0.3s ease-in-out, box-shadow 0.6s linear;transition: height 0.3s ease-in-out, box-shadow 0.6s linear;}

code

.ac-container label {padding: 10px 100px 10px 17px;margin: 0;position: relative;z-index: 20;display: block;color: #333;line-height: 25px;font-size: 1.063em;background: #ffffff;background: -moz-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: -webkit-gradient(linear, left top, left bottom, color-stop(1%, #ffffff), color-stop(100%, #eaeaea));background: -webkit-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: -o-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: -ms-linear-gradient(top, #ffffff 1%, #eaeaea 100%);background: linear-gradient(top, #ffffff 1%, #eaeaea 100%);filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eaeaea', GradientType=0);box-shadow: 0px 0px 0px 1px rgba(155, 155, 155, 0.3), 1px 0px 0px 0px rgba(255, 255, 255, 0.9) inset, 0px 2px 2px rgba(0, 0, 0, 0.1);}

建議修改：

刪除 overflow: hidden;
刪除 z-index;

補充

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