H5button按鈕在webviwe中的不一樣表現

  1. 在項目中有一個button按鈕,在chrome和ios上表現都很正常,可是在Android上表現的文字稍微的往上一點點,很詭異。因而Google了一下,上面說使用rem佈局的話Android的像素處理與ios不一樣,因此致使出現這個問題。網上說的幾種解決方法,一種去掉標籤的移動視口,可是去掉之後全部數據單位會縮小,不是很實用,還有說是加line-hight:1一樣是不起做用。還有說是加padding讓文字劇中,可是測試了一下並不還使。
  2. 因而我把button的高度寫死,不用rem,不給他line-hight,使用padding,可是在iOS上不是很友好,沒辦法只能分開處理。
str+=`<button class="noForward" style=" padding: 2px;" data-title="` + res.data.product_list[i].product_name + `" data-id="` + res.data.product_list[i].product_id + `" data-price="` + res.data.product_list[i].price + `" data-code="` + res.data.product_list[i].product_code + `">轉發</button>` +
                  `</li>` +
                  `</ul>` +
                  `</div>` +
                  `</div>` +
                  `</li>`
              }else{
                str+=`<button class="noForward" style=" line-height: 30px;" data-title="` + res.data.product_list[i].product_name + `" data-id="` + res.data.product_list[i].product_id + `" data-price="` + res.data.product_list[i].price + `" data-code="` + res.data.product_list[i].product_code + `">轉發</button>` +
                  `</li>` +
                  `</ul>` +
                  `</div>` +
                  `</div>` +
                  `</li>`
              }
複製代碼
  1. 分開處理這樣就能夠了
相關文章
相關標籤/搜索