文章詳情頁
html5 - 做PC的全屏頁面的時候,該怎么設計這個頁面在所有屏幕分辨率上不變形?
瀏覽:93日期:2023-01-26 16:20:53
問題描述
1.要做一個全屏滾動的頁面,每個頁面內(nèi)容都比較多,現(xiàn)在我都是寬高百分比顯示,但是文字沒法縮放,會使頁面有些亂。2.ui做的界面是1920*1080的。
問題解答
回答1:采用rem定義字號。同時配合媒體查詢
回答2:簡單的響應式media屬性,想一些字體,內(nèi)外邊距的單位可以換成rem比較好控制
回答3:首先 rem處理自適應布局是不錯 但是 rem不兼容IE9以下兼容性要求高的話 寫了也白搭其次 移動端用rem布局的時候,文字一般也不用rem,因為由于不同的rem計算方式會產(chǎn)生很多奇怪的大小,使得文字出現(xiàn)糊掉或者模糊的情況,通常使用媒體查詢事先設置好body的字體大小,這樣來確保文字的正常顯示,然后用em控制
至于題主說的是pc端前端的頁面基本不需要自適應大小,畢竟瀏覽器都有放大功能,不過在高分辨率屏幕下,感覺現(xiàn)在頁面的字體確實太小所以 如果涉及到因為字體問題 使得布局糊掉的話建議題主還是使用media query 媒體查詢來設置在不同分辨率下的字體大小吧;
回答4:可以設置背景圖片居中對齊,不要限定100%,這樣不是最佳。也可以用css3 media媒體查詢器。順便推薦一個做全屏頁面的插件fullPage.js
http://www.jq22.com/jquery-in...
標簽:
Html5
排行榜

熱門標簽