移动端web开发整理
?
/* 移動端定義字體的代碼 */
body {
font-family: "Helvetica Neue", Helvetica;
}
?
ios端觸摸時,會出現一個半透明灰色遮罩
如果想要禁用,可設置-webkit-tap-highlight-color的alpha值為0
body{-webkit-tap-highlight-color: rgba(0,0,0,0);}
?
關于 iOS 與 OS X 端字體的優化(橫豎屏會出現字體加粗不一致等)
iOS 瀏覽器橫屏時會重置字體大小
body{
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
}
?
禁止 iOS 彈出各種操作窗口
-webkit-touch-callout:none;
?
禁止用戶選中文字
-webkit-user-select:none;
?
上下拉動滾動條時卡頓、慢
div {
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
}
IOS設備輸入框默認內陰影
input {
-webkit-appearance: none;
}
?
// 阻止頁面滑動的默認行為
document.body.addEventListener('touchmove', function(event) {
if (event.cancelable) {
// 判斷默認行為是否已經被禁用
(!event.defaultPrevented) && event.preventDefault();
}
});
?
轉載于:https://www.cnblogs.com/huliang56/p/6991315.html
總結
以上是生活随笔為你收集整理的移动端web开发整理的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 【转】HTML5移动端最新兼容问题解决方
- 下一篇: std::bind 详解及参数解析