基本設置:
html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1,minimum-scale=1,maxmum-scale=1"> 6 <!-- 設置電話和郵件不可點擊--> 7 <meta name="format-detection" content="telephone=no,email=no" /> 8 <!-- 設置app名字--> 9 <meta name="apple-mobile-web-app-title" content="佳"> 10 <!-- herf中放圖片地址,設置app的外觀--> 11 <link rel="apple-touch-icon-precomposed" href=""> 12 <title>Document</title> 13 <style> 14 body{ 15 margin:0; 16 /* 默認字體 */ 17 font-family:helvetica; 18 } 19 body{ 20 /* 禁止用戶選中文字 */ 21 -webkit-user-select:none; 22 /* 禁止長按彈出系統菜單 */ 23 -webkit-touch-callout:none; 24 /* 切換橫豎屏或者用戶本身經過瀏覽器設置的話,能夠改變字體的大小(須要給body下的全部元素)*/ 25 -webkit-text-size-adjust:100%; 26 } 27 a,input,button{ 28 /* 去除android下a/botton/input標籤被點擊時產生的邊框 & 去除ios下a標籤被點擊時產生的半透明灰色背景*/ 29 -webkit-tap-highlight-color:rgba(0,0,0,0); 30 31 } 32 button,input{ 33 /* 去除按鈕圓角 */ 34 -webkit-appearance:none /* button與inout都會有默認背景*/ 35 /* border-radius:0; */ 36 } 37 /* 設置placeholder樣式,默認黑色,點擊變紅色 */ 38 input::-webkit-input-placeholder{ 39 color:#000; 40 } 41 input:focus::-webkit-input-placeholder{ 42 color:#f00; 43 } 44 </style> 45 </head> 46 <body> 47 <p>13000000000</p> 48 <a href="#">dlfjdf;dk</a> 49 <button>吃飯</button> 50 <input type="text" value="睡覺"> 51 <input type="text" placeholder="sjdksjk"> 52 </body> 53 </html>