在網頁設計中，CSS滑動門技術是一種非常實用的技巧，可以幫助我們實現頁面中多種效果，例如左右滑動門。通過CSS代碼的設置，我們可以輕松地實現這一效果，讓您的網頁更加炫酷。

.slide-door{
width: 960px;
height: 300px;
margin: 0 auto;
position: relative;
}
.slide-door ul{
width: 100%;
height: 300px;
position: absolute;
left: 0;
top: 0;
margin: 0;
padding: 0;
}
.slide-door ul li{
float: left;
width: 960px;
height: 300px;
margin: 0;
padding: 0;
list-style: none;
}
.slide-door ul li .door{
position: absolute;
width: 0;
height: 100%;
top: 0;
z-index: 100;
background: #fff;
overflow: hidden;
transition: all .5s ease-in-out;
}
.slide-door ul li .door:before{
content:"";
display: block;
position: absolute;
width: 50px;
height: 100%;
top: 0;
right: -25px;
background: url(images/bg.png) no-repeat;
background-position: -80px 0px;
border-radius: 0 50% 50% 0;
}
.slide-door ul li .door:after{
content:"";
display: block;
position: absolute;
width: 50px;
height: 100%;
top: 0;
left: -25px;
background: url(images/bg.png) no-repeat;
background-position: 0px 0px;
border-radius: 50% 0 0 50%;
}
.slide-door ul li:hover .door{
width: 50%;
}
.slide-door ul li.left:hover .door{
left: 0;
width: 50%;
}
.slide-door ul li.right:hover .door{
right: 0;
width: 50%;
}

這是CSS實現左右滑動門需要的代碼。我們可以通過定義HTML元素的結構，以及CSS的樣式來實現兩側滑動的效果。當鼠標經過元素的時候，通過設置相應的樣式，來實現效果的切換。

通過以上代碼的設置，可以實現一個完整的左右滑動門效果。在實際應用中，我們還可以調整代碼的樣式和細節，來滿足我們的需求，讓網頁的效果更加炫酷。同時，在進行樣式設置的時候，要注意瀏覽器兼容性，以確保不同瀏覽器中的顯示效果一致。