Share Button cực kì thú zị

Chào các bạn đã trở lại honghaiblog hôm nay mình xin share button cực kì thú zị này...

Cách Thực hiện

Bước 1: Ta chèn đoạn code phía dưới vào trước thẻ ]]></b:skin>

.button-boxss {

   font: 500 15px Roboto;

    border: 5px solid transparent;

    background: #52537d;

    color: #ffffff;

    border-radius: 40px;

    padding: 9px 30px;

    overflow: hidden;

    width: 200px;

    transition: all 1.2s, border 0.5s 1.2s, box-shadow 0.3s 1.5s;

    white-space: nowrap;

    text-indent: 12px;

    font-weight: bold; }

 .button-boxss span {

    display: inline-block;

    transform: translateX(300px);

    font-weight: normal;

    opacity: 0;

    transition:

      opacity 0.1s 0.5s,

      transform 0.4s 0.5s;

  }

.button-boxss:hover{

text-indent: 0;

    background: #52537d;

    color: #e4ba3a;

    width: 250px;

    border: 5px solid #7578cc;

    box-shadow: 3px 3px 2px rgba(black, 0.15);

}

 .button-boxss:hover span{

    -webkit-transform: translateX(0);

    transform: translateX(0);

    opacity: 1;}

 Bước 2: Ta chèn code bên dưới vào nơi bạn muốn hiển thị

<button class="button-boxss">Demo Button<span>Vip.</span></button>

 nhớ chỉnh sửa sao cho phù hợp...