手機瀏覽器 css 問題

css

leooel97895750 2020-07-24 17:26:49 ‧ 1868 瀏覽

分享至

目前寫一個背景全黑的網頁
但是用手機瀏覽器safari或chrome的話
上下會出現莫名的空白如下圖

電腦chrome就不會
以下是我的css

#content{
    padding: 0px;
    margin: 0px;
    position: absolute;
    background-color: black;
    color: white;
    height: 100%;
    width: 100%;
}

請問各位該怎麼解決

㊣浩瀚星空㊣ iT邦大神 1 級 ‧ 2020-07-24 17:41:42 檢舉

如果是只有這個css。沒有問題。
所以你的問題是其它地方才對。

請善用f12大法來查。(靠，忘了手機沒f12)

leooel97895750 iT邦新手 5 級 ‧ 2020-07-24 17:58:20 檢舉

我覺得是iphone的問題ㄟ
安卓的正常
因為iphone可以上拉下拉
但是我看其他網頁上拉下拉也可以有其他顏色
可能有甚麼寫法存在?

leooel97895750 iT邦新手 5 級 ‧ 2020-07-24 19:50:12 檢舉

喔~我知道了
因為後來iphone會設安全區域避免瀏覽器按鍵擋住網頁內容
所以div的height、width 100%就會保留一段空白
從body改background-color就無關安全區域

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

qpalzm

iT邦研究生 5 級 ‧ 2020-07-24 17:43:50

我將margin調整負數就正常囉~

 margin: -9px;

回應 4
分享
檢舉

看更多先前的回應...收起先前的回應...

dragonH iT邦超人 5 級 ‧ 2020-07-24 17:47:28 檢舉

我將margin調整負數就正常囉~

margin: -9px;

這樣改你確定在 desktop 不會有問題?

qpalzm iT邦研究生 5 級 ‧ 2020-07-24 17:51:14 檢舉

但我測試都正常耶~~如果有錯~請自動忽略我~

leooel97895750 iT邦新手 5 級 ‧ 2020-07-24 18:00:35 檢舉

你是iphone嗎?
我用你這招可以蓋到初始畫面最上面的空白
但上拉下拉還是會出現大範圍空白

qpalzm iT邦研究生 5 級 ‧ 2020-07-27 08:36:33 檢舉

不是耶我是安卓~應該我的方法變成治標不治本了

登入發表回應

我要發表回答

立即登入回答

參賽組數

1064 組

團體組數

40 組

累計文章數

22200 篇

完賽人數

602 人

15th鐵人賽 16th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 javascript 2018鐵人賽 python 2017鐵人賽 windows php c# windows server linux css react vue.js

IT邦幫忙