Open1

hover時にデカくなる+keyframeで色が定期的に変化する表のCSS

enumuraenumura
table {
    border-collapse: collapse;
    background-color: #D6EDFF;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
    transition: transform 0.2s ease;
    animation: backgroundChange 10s infinite alternate;
}

table:hover {
    transform: scale(1.05);
}

th, td {
    border: 1px solid #ddd;
}

th, td {
    padding: 12px;
    text-align: center;
}

tr:nth-child(even) {
    background-color: #EAF9FF;
}

@keyframes backgroundChange {
    0% {
        background-color: #D6EDFF;
    }
    100% {
        background-color: #FFFFFF;
    }
}