學習標準的朋友，通常都會在學習的過程中接觸到css滑動門技術，或許大家也都看過這篇文章《css中的滑動門技術》，如果你還沒接觸過或還沒看過上文或有點忘記內容，也沒關係，可以點擊上面的文章鏈接，先了解或溫習一遍。
在《css中的滑動門技術》一文中的滑動門例子，大家仔細實驗，或許已經發現，鏈接區有9像素的盲點無法點擊，而且在ie下，只能點擊文字部分大小，不能點選整個按鈕區塊。而我們或許期望的是整個按鈕區塊都可以點擊，而且不允許有盲點存在。
那我們又該如何去實現呢？下面我們一起來探討一些解決方法：
首先為了方便我們先把《css中的滑動門技術》中的程式碼移過來：
xhtml部分：
<div id="header"> <ul> <li><a href="#">home</a></li> <li id="current"><a href="#">news</a></li> <li><a href="#">products</a></li> <li><a href="#">about</a></li> <li><a href="#">contact</a></li> </ul> </div>
css部分：
#header {
float:left;
width:100%;
background:#DAE0D2 url("bg.gif") repeat-x bottom;
font-size:93%;
line-height:normal;
}
#header ul {
margin:0;
padding:10px 10px 0;
list-style:none;
}
#header li {
float:left;
background:url("left.gif") no-repeat left top;
margin:0;
padding:0 0 0 9px;
}
#header a {
float:left;
display:block;
background:url("right.gif") no-repeat right top;
padding:5px 15px 4px 6px;
text-decoration:none;
font-weight:bold;
color:#765;
}
/* Commented Backslash Hack
hides rule from IE5-Mac \*/
#header a {float:none;}
/* End IE5-Mac hack */
#header a:hover {
color:#333;
}
#header #current {
background-image:url("left_on.gif");
}
#header #current a {
background-image:url("right_on.gif");
color:#333;
padding-bottom:5px;
}
