TheBuliderBob
Centipat
- Katılım
- 24 Mart 2024
- Mesajlar
- 91
Daha fazla
- Cinsiyet
- Erkek
Ben, bottom kullanarak bir 3D tarzı bir şey yapmayı planlıyordum ama bottom için transition eklememe rağmen hareket pürüzsüz olmuyordu. Bu yüzden translateY kullanmak zorunda kaldım. Peki bunun nedeni nedir?
"
"
HTML:
<style>
.ONE{
background-color: green;
border: none;
border-radius: 2px;
color: white;
padding-top: 4px;
padding-bottom: 4px;
padding-left: 4px;
padding-right: 4px;
cursor: pointer;
font-size: 13px;
transition: padding 0.3s, transform 0.3s, box-shadow 0.3s;
position: relative;
margin-left: 5px;
}
.ONE:hover{
padding-right: 12px;
padding-left: 12px;
}
.ONE:active{
box-shadow: 1px 1px 12px 1.5px rgba(5, 153, 5, 0.717);
transform: translateY(-1.5px);
}
</style>
<button class="ONE">
ONE
</button>
Son düzenleyen: Moderatör:
