衛生福利部疾病管制署---吳姿瑩

ray 衛生福利部
, ,
#1

網站

衛生福利部疾病管制署

姓名

吳姿瑩

檢測日期

2018-04-20

檢測裝置

Samsung Galaxy A8 SM-A530F

作業系統 與 瀏覽器版本

Android 7.1.1
Chrome 61.0.3163.98

解析度（手機螢幕）

360X740 Pixels

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

是

跑版（影響閱讀）問題

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

無

出現亂碼

無

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

無

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

無

閱讀模式

我是安卓

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

無

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

只有首頁有行動版，其他都會自動跳回電腦版網頁

#2

問題：

可能原因：

行距設置不一致。

原始程式：

  1. 位置： https://www.cdc.gov.tw/css/global.css:5 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    line-height: 160%;
}

建議修改：

加入行距設定，在CSS中加入line-height: 160%;。

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    line-height: 160%;
}

補充：

(修正後之截圖)
6

#3

問題：

可能原因：

  1. 行距設置不一致。
  2. 影片過小。

原始程式：

  1. span行距設置，位置： https://www.cdc.gov.tw/css/global.css:5 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    line-height: 160%;
}
  1. 影片iframe設置，位置：view-source:首頁-衛生福利部疾病管制署 
<p style="line-height: 160%;">
	<iframe src="//www.youtube.com/embed/oSmnJJdK_Ds" width="420" height="315" frameborder="0" title="關於CDC"></iframe>
</p>

建議修改：

  1. 加入行距設定，在CSS中加入line-height: 160%;。
    位置： https://www.cdc.gov.tw/css/global.css:5 
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0;
    padding: 0;
    line-height: 160%;
}
  1. (1)在中新增以下CSS。
.video-container {

position: relative;

padding-bottom: 56.25%;

padding-top: 30px;

height: 0;

overflow: hidden;

}

.video-container iframe, .video-container object, .video-container embed {

position: absolute;

top: 0;left: 0;

width: 100%;

height: 100%;
}

(2)在youtube提供的iframe原始碼外層加入<div class="video-container"></div>。
位置： view-source:首頁-衛生福利部疾病管制署

<div class="video-container">
    <iframe src="//www.youtube.com/embed/oSmnJJdK_Ds" width="420" height="315" frameborder="0" title="關於CDC"></iframe>
</div>

補充：

(修正後之截圖)
7