色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css3switch切換

劉若蘭1年前7瀏覽0評論

CSS3Switch切換器(CSS3 Switch)是一種基于CSS3的切換按鈕,它不需要任何Javascript的支持,可以完全通過CSS來實現。這種切換器非常簡單易用,而且兼容性也很好,適用于各種網站的切換效果。

下面是CSS3Switch切換器的基本代碼:

.switch {
position: relative;
display: inline-block;
width: 60px;
height: 34px;
}
.switch input[type="checkbox"] {
opacity: 0;
width: 0;
height: 0;
}
.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
-webkit-transition: .4s;
transition: .4s;
}
.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: #fff;
-webkit-transition: .4s;
transition: .4s;
}
input:checked + .slider {
background-color: #2196F3;
}
input:checked + .slider:before {
-webkit-transform: translateX(26px);
-ms-transform: translateX(26px);
transform: translateX(26px);
}

通過上面的CSS樣式,我們可以創建一個非常簡單的切換按鈕,只需要在頁面中引用這些代碼即可:

這個切換器看起來非常簡單,但是它的效果非常出色,可以讓網站變得更加動態,更加現代化。而且這個切換器還可以進行個性化的定制,根據網站的需要來進行不同的顏色和樣式調整。