文章詳情頁
html5 - 手機自適應的圖片高度rem是怎么計算的
瀏覽：104日期：2023-06-16 11:53:55
問題描述
手機網頁布局是兩個li一行占滿寬度
li { width: 7.375rem; height: 4.5rem; float: left; margin-left: .4rem; position: relative;}li img{ width: 100%; height: 4.5rem; display: block; border-radius: .3rem; overflow: hidden; background-color: #fff;}
rem是根據html的font-size來自動變的。請問這個li的初始寬高值怎么計算呢？
問題解答
回答1：你rem是怎么算的？拿我的計算方式說吧！我計算的方式，就是：(屏幕寬度/效果圖寬度)*100+’px’;比如效果圖是750，屏幕375,1rem=(375/750)*100+’px’,就是1rem=50px如果一張圖片在效果圖上寬為100px,高為50px;那個樣式設置就是img{height:.5rem;width:1rem;}
但是我不明白就是，兩個li占滿一行，li寬度設置50%不就好了？
標簽：
Html5
相關文章：
1. angular.js - webpack build后的angularjs路由跳轉問題2. java - Activity中的成員變量被賦值之后，Activity被回收的時候內存才會被釋放嗎3. java - web項目中，用戶登陸信息存儲在session中好 還是cookie中好，取決于什么？4. 數組按鍵值封裝！5. php由5.3升級到5.6后，登錄網站，返回的是php代碼，不是登錄界面，各位大神有知道的嗎？6. 我寫的哪里有錯？請大神幫忙查看一下。7. tp5.0，param獲取全部參數8. 使用list和each配合，的作業，輸出一行后，如何換行9. 老師，flex-shrink: 1; 按視頻操作，不會自動縮放10. 為什么 必須在<ul> 下建立 <li> 在建<a>?
排行榜
網公網安備