간단한 애니메이션 버튼 CSS 입니다. > 그누보드5 팁자료실

그누보드5 팁자료실

간단한 애니메이션 버튼 CSS 입니다. 정보

간단한 애니메이션 버튼 CSS 입니다.

본문

정말 심플한 애니메니션 버튼 입니다..^^;;

3699138664_1623748115.9992.png3699138664_1623748123.1733.png


.ani_button {
        font-size: 14px;
        height: 30px;
        line-height: 30px;
        color: #fff;
        display: inline-block;
        background: linear-gradient(-45deg, #ee7752, #e73c7e, #ccc, #f3f3f3);
        background-size: 400% 400%;
        animation: AnimationName 15s ease infinite;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        top: 35%;
        text-align: center;
        padding: 0 20px;
        border-radius: 20px;
    }

    @keyframes AnimationName
    {
        0% {
            background-position: 0% 50%;
        }

        50% {
            background-position: 100% 50%;
        }
        100% {
            background-position: 0% 50%;
        }
    }

추천
5

댓글 3개

전체 2,412 |RSS
그누보드5 팁자료실 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT