繼續(xù)分享我整理了5年的面試題
html：http://www.reibang.com/p/aa218e2b8fe1
css：http://www.reibang.com/p/0f5571b75fb5
javascript：http://www.reibang.com/p/fe1089a4ab1a
jquery：http://www.reibang.com/p/363fc2615cfe
另外附上課程鏈接：https://www.3mooc.com/front/learning/routesecond?subjectid=1232
1存炮，ios系統(tǒng)中元素被觸摸時產(chǎn)生的半透明灰色遮罩怎么去掉
ios用戶點擊一個鏈接登馒，會出現(xiàn)一個半透明灰色遮罩, 如果想要禁用丑掺，可設(shè)置-webkit-tap-highlight-color的alpha值為0，也就是屬性值的最后一位設(shè)置為0就可以去除半透明灰色遮罩
a,button,input,textarea{-webkit-tap-highlight-color: rgba(0,0,0,0;)}
2掉冶，webkit表單輸入框placeholder的顏色值能改變么
input::-webkit-input-placeholder{color:#AAAAAA;}
input:focus::-webkit-input-placeholder{color:#EEEEEE;}
3涎跨，webkit表單輸入框placeholder的文字能換行么
ios可以，android不行~
在textarea標簽下都可以換行~
4茫多，禁止ios 長按時不觸發(fā)系統(tǒng)的菜單绷耍，禁止ios&android長按時下載圖片
.css{-webkit-touch-callout: none}
5吐限，禁止ios和android用戶選中文字
.css{-webkit-user-select:none}
6，打電話發(fā)短信寫郵件怎么實現(xiàn)
打電話： <a href="tel:0755-10086">打電話給:0755-10086</a>
發(fā)短信褂始，winphone系統(tǒng)無效 <a href="sms:10086">發(fā)短信給: 10086</a>
寫郵件： <a href=“mailto:peun@foxmail.com">peun@foxmail.com</a>
7诸典，模擬按鈕hover效果
移動端觸摸按鈕的效果，可明示用戶有些事情正要發(fā)生崎苗，是一個比較好體驗狐粱，但是移動設(shè)備中并沒有鼠標指針，使用css的hover并不能滿足我們的需求胆数，還好國外有個激活移動端css的active效果肌蜻。
1，直接在body上添加ontouchstart必尼，同樣可激活移動端css的active效果蒋搜，比較推薦這種方式（兼容性ios5+、部分android 4+判莉、winphone 8）
2豆挽，要做到全兼容的辦法，可通過綁定ontouchstart和ontouchend來控制按鈕的類名
8券盅，audio元素和video元素在ios和andriod中無法自動播放
應(yīng)對方案：觸屏即播
$('html').one('touchstart',function(){
audio.play()
})
9帮哈，消除transition閃屏
網(wǎng)絡(luò)都是這么寫的，但我并沒有測試出來
.css{
/*設(shè)置內(nèi)嵌的元素在 3D 空間如何呈現(xiàn)：保留 3D*/
-webkit-transform-style: preserve-3d;
/*（設(shè)置進行轉(zhuǎn)換的元素的背面在面對用戶時是否可見：隱藏）*/
-webkit-backface-visibility: hidden;
}
10锰镀，開啟硬件加速
1娘侍，解決頁面閃白
2，保證動畫流暢
.css {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
11泳炉，取消input在ios下憾筏，輸入的時候英文首字母的默認大寫
<input autocapitalize="off" autocorrect="off" />
12，android 上去掉語音輸入按鈕
input::-webkit-input-speech-button {display: none}
13胡桃，H5頁面窗口自動調(diào)整到設(shè)備寬度踩叭，并禁止用戶縮放頁面
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
14，忽略將頁面中的數(shù)字識別為電話號碼
<meta name="format-detection" content="telephone=no" />
15翠胰，忽略Android平臺中對郵箱地址的識別
<meta name="format-detection" content="email=no" />
