css3中一些隱藏的高級(jí)屬性之混合屬性用法詳解

-webkit-user-select 和 -moz-user-select

或許你常常不希望用戶在你的網(wǎng)站上選擇文本，無(wú)論是否是出于版權(quán)的原因。通常大家會(huì)有js來(lái)實(shí)現(xiàn)，另一個(gè)方案就是，將-webkit-user-select 和-moz-user-select 的值設(shè)為none。

請(qǐng)謹(jǐn)慎使用這個(gè)屬性：因?yàn)榇蟛糠钟脩羰莵?lái)查看信息的，他們可以復(fù)制并存儲(chǔ)下來(lái)以備將來(lái)之用，所以這種方法既無(wú)用也無(wú)效。如果你禁用了復(fù)制粘貼功能，用戶還是可以通過(guò)查看源文件來(lái)獲取到他們想要的內(nèi)容。搞不懂這個(gè)屬性為什么會(huì)被webkit和gecko支持。

瀏覽器支持: WebKit, Gecko.

-webkit-appearance 和 -moz-appearance

你曾經(jīng)想過(guò)將一張圖片偽裝成單選按鈕么？或者，一個(gè)輸入框看起來(lái)像一個(gè)復(fù)選框？那么現(xiàn)在appearance 出現(xiàn)了。即便你并不想要讓一個(gè)鏈接看起來(lái)總是像個(gè)按鈕，下面這個(gè)例子也可以讓你了解到，只要你愿意就可以做到的：

示例

 a {
-webkit-appearance: button;
-moz-appearance: button;
}

瀏覽器支持: WebKit, Gecko.

text-align: -moz-center/-webkit-center

這是一個(gè)屬性（或者精確來(lái)說(shuō)，是個(gè)“屬性值”）的存在很讓人驚喜啊。要讓一個(gè)塊級(jí)元素居中，大家通常將其設(shè)置為margin:0 auto。但是，現(xiàn)在你也可以將元素的容器的text-align屬性設(shè)置為-moz-center 和 -webkit-center。相應(yīng)的，你也可以通過(guò)設(shè)置-moz-left、-webkit-left或-moz-right、-webkit-right將元素居左或者居右。

瀏覽器支持: WebKit, Gecko.

-webkit-tap-highlight-color

這個(gè)屬性只用于iOS (iPhone和iPad)。當(dāng)你點(diǎn)擊一個(gè)鏈接或者通過(guò)Javascript定義的可點(diǎn)擊元素的時(shí)候，它就會(huì)出現(xiàn)一個(gè)半透明的灰色背景。要重設(shè)這個(gè)表現(xiàn)，你可以設(shè)置-webkit-tap-highlight-color為任何顏色。

想要禁用這個(gè)高亮，設(shè)置顏色的alpha值為0即可。

示例：設(shè)置高亮色為50%透明的紅色:

-webkit-tap-highlight-color: rgba(255,0,0,0.5);

瀏覽器支持: 只有iOS(iPhone和iPad).

outline：none(1)在pc端為a標(biāo)簽定義這個(gè)樣式的目的是為了取消ie瀏覽器下點(diǎn)擊a標(biāo)簽時(shí)出現(xiàn)的虛線。ie7及以下瀏覽器還不識(shí)別此屬性，需要在a標(biāo)簽上添加hidefocus="true"(2)input，textarea{outline:none} 取消chrome下默認(rèn)的文本框聚焦樣式(3)在移動(dòng)端是不起作用的，想要去除文本框的默認(rèn)樣式可以使用-webkit-appearance，聚焦時(shí)候默認(rèn)樣式的取消是-webkit-tap-highlight-color。看到一些移動(dòng)端reset文件加了此屬性，其實(shí)是多余。

webkit-appearance -webkit-appearance: none; //消除輸入框和按鈕的原生外觀，在iOS上加上這個(gè)屬性才能給按鈕和輸入框自定義樣式 。 注意：不同type的input使用這個(gè)屬性之后表現(xiàn)不一。text、button無(wú)樣式，radio、checkbox直接消失。

聲明：本網(wǎng)頁(yè)內(nèi)容旨在傳播知識(shí)，若有侵權(quán)等問(wèn)題請(qǐng)及時(shí)與本網(wǎng)聯(lián)系，我們將在第一時(shí)間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com