文章詳情頁
css3 - h5單頁滾動的圖尺寸問題
瀏覽:121日期:2023-07-06 16:54:20
問題描述
做全屏滾動的五六個圖的頁面,一個圖一個頁面,但是視覺給的圖都是一個大小,有的圖在不同的尺寸顯示不一致,比如有個轉盤是扁的。有什么辦法呢?
問題解答
回答1:首先說視覺上變形是因為什么,因為你沒有等比例縮放,視覺上肯定會不和諧。要確認下,h5頁面是不是要鋪滿,還是直接用設計圖寬度100%,上下居中就行,不管上下留白。再說,這種h5頁面,比如轉盤要單拿出來,固定相對的一個位置,如 top:50%; margin-top:*px。這樣在各個高度就不會變形。
回答2:用的@media設置不同分辨率的,有些有的字體啥的不區分可能沒啥事,大圓圈區分一下大小吧
回答3:圖片背景處理方法background-size:cover;background-position:center center;
img圖片position:absolutel;top:50%;left:50%;margin:負數 圖片的高度的一半 0 0 負數 圖片的寬度的一半
標簽:
CSS
相關文章:
1. python bottle跑起來以后,定時執行的任務為什么每次都重復(多)執行一次?2. python - 爬蟲模擬登錄后,爬取csdn后臺文章列表遇到的問題3. html5 - HTML代碼中的文字亂碼是怎么回事?4. 視頻文件不能播放,怎么辦?5. javascript - vue2如何獲取v-model變量名6. javascript - 求幫助 , ATOM不顯示界面!!!!7. mysql - 分庫分表、分區、讀寫分離 這些都是用在什么場景下 ,會帶來哪些效率或者其他方面的好處8. javascript - 為什么在谷歌控制臺 輸出1的時候,輸出的1立馬就不見了9. javascript - angular使從elastichearch中取出的文本高亮顯示,如圖所示10. javascript - ios返回不執行js怎么解決?
排行榜
