CSS實(shí)現(xiàn)超級(jí)鏈接需要通過雙擊后跳轉(zhuǎn)
發(fā)布時(shí)間：2013-10-12 17:45:06 作者：佚名 
我要評(píng)論
我要評(píng)論超級(jí)鏈接需要雙擊后跳轉(zhuǎn)如何實(shí)現(xiàn)，其實(shí)很簡(jiǎn)單，在本文將為大家介紹下具體的實(shí)現(xiàn)方法，感興趣的朋友不要錯(cuò)過
CSS代碼
.test3 span {
position: relative;
}
.test3 span a {
position: relative;
z-index: 2;
}
.test3 span a:hover, .test3 span a:active {
z-index: 4;
}
.test3 span input {
background: transparent;
border: 0;
cursor: pointer;
position: absolute;
top: -1px;
left: 0;
width: 101%; /* Hacky */
height: 301%; /* Hacky */
z-index: 3;
}
.test3 span input:focus {
background: transparent;
border: 0;
z-index: 1;
}
html代碼
<div class="test3">
<span><input type="text" value=" " readonly="true" />
<a >Double click me</a></span>
</div>
復(fù)制代碼
代碼如下:.test3 span {
position: relative;
}
.test3 span a {
position: relative;
z-index: 2;
}
.test3 span a:hover, .test3 span a:active {
z-index: 4;
}
.test3 span input {
background: transparent;
border: 0;
cursor: pointer;
position: absolute;
top: -1px;
left: 0;
width: 101%; /* Hacky */
height: 301%; /* Hacky */
z-index: 3;
}
.test3 span input:focus {
background: transparent;
border: 0;
z-index: 1;
}
html代碼
復(fù)制代碼
代碼如下:<div class="test3">
<span><input type="text" value=" " readonly="true" />
<a >Double click me</a></span>
</div>
相關(guān)文章
純CSS實(shí)現(xiàn)網(wǎng)頁(yè)內(nèi)部錨點(diǎn)跳轉(zhuǎn)時(shí)上下偏移的示例代碼
這篇文章主要介紹了純CSS實(shí)現(xiàn)網(wǎng)頁(yè)內(nèi)部錨點(diǎn)跳轉(zhuǎn)時(shí)上下偏移的示例代碼，文中通過示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨2020-04-09使用CSS中的meta實(shí)現(xiàn)web定時(shí)刷新或跳轉(zhuǎn)的方法
這篇文章主要介紹了使用CSS中的meta實(shí)現(xiàn)web定時(shí)刷新或跳轉(zhuǎn)的方法,比使用JavaScript腳本實(shí)現(xiàn)起來更加簡(jiǎn)單一些,需要的朋友可以參考下2015-06-05
CSS頁(yè)面中點(diǎn)擊超鏈接如何跳轉(zhuǎn)新的頁(yè)面
這篇文章主要介紹了CSS頁(yè)面中點(diǎn)擊超鏈接如何跳轉(zhuǎn)新的頁(yè)面,本文通過示例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2023-09-13
