xong

THB

Founder
Thành viên BQT
Tham gia
25/02/2015
Bài viết
6,649
Được Like
3,938
cái này chờ @PVS nhé.
 

snail

Gefreiter
Tham gia
12/11/2015
Bài viết
64
Được Like
48
Mã:
    -webkit-animation: color-change 1s infinite;
    -moz-animation: color-change 1s infinite;
    -o-animation: color-change 1s infinite;
    -ms-animation: color-change 1s infinite;
    animation: color-change 1s infinite;

Đây là nháy

Mã:
    font-weight: bold;
    text-shadow: 0 0 8px #000000, 0 0 2px #2D2EB7, 0 1px 0 #000000, 0 0 9px #272984;
    background-color: white;
    padding: 2px 6px;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    border-radius: 4px;

Đây là hiệu ứng như demo, Muốn như demo thì thêm cả 2
 

ducga

Private
Tham gia
30/10/2015
Bài viết
25
Được Like
4
asdasdasdsadddddddddddddddd
 
Sửa lần cuối:

snail

Gefreiter
Tham gia
12/11/2015
Bài viết
64
Được Like
48
em add cả 2 vào mà nó có hiện cái khung trắng còn chữ thì k nháy anh ạ
Bạn thêm đoạn này vào extra nhé

Mã:
@-webkit-keyframes color-change {
     0% { color: #F8CD0A; }
     50% { color: #fff;  }
     100% { color: #F8CD0A;  }
 }
 @-moz-keyframes color-change {
     0% { color: #F8CD0A;  }
     50% { color: #fff;  }
     100% { color: #F8CD0A;  }
 }
 @-o-keyframes color-change {
     0% { color: #F8CD0A; }
     50% { color: #fff; }
     100% { color: #F8CD0A;  }
 }
 @keyframes color-change {
     0% { color: #F8CD0A;  }
     50% { color: #fff;  }
     100% { color: #F8CD0A;  }
 }

Trong đoạn css trên bạn chỉ cần chú ý 2 thuộc tính @keyframesanimation:

  • @-moz- hỗ trợ cho firefox.
  • @-webkit- hỗ trợ cho Google Chrome và Safari.
  • color-change : là tên của thuộc tính mình đặt, tên thuộc tính này được animation sử dụng
  • 0%,50%,100%: là các thuộc tính css cho từng giai đoạn, ở đây mình sử dụng thuộc tính color để đổi 2 màu trắng và cam thay đổi nhau
  • 1s : là thời gian chuyển động (1s = 1000ms)
  • infinite : để cho animation luôn chuyển động (có nghĩa là nó sẽ nhấp nháy mãi)
 
Sửa lần cuối:

ducga

Private
Tham gia
30/10/2015
Bài viết
25
Được Like
4
Bạn thêm đoạn này vào extra nhé

Mã:
@-webkit-keyframes color-change {
     0% { color: #F8CD0A; }
     50% { color: #fff;  }
     100% { color: #F8CD0A;  }
 }
 @-moz-keyframes color-change {
     0% { color: #F8CD0A;  }
     50% { color: #fff;  }
     100% { color: #F8CD0A;  }
 }
 @-o-keyframes color-change {
     0% { color: #F8CD0A; }
     50% { color: #fff; }
     100% { color: #F8CD0A;  }
 }
 @keyframes color-change {
     0% { color: #F8CD0A;  }
     50% { color: #fff;  }
     100% { color: #F8CD0A;  }
 }

Trong đoạn css trên bạn chỉ cần chú ý 2 thuộc tính @keyframesanimation:

  • @-moz- hỗ trợ cho firefox.
  • @-webkit- hỗ trợ cho Google Chrome và Safari.
  • color-change : là tên của thuộc tính mình đặt, tên thuộc tính này được animation sử dụng
  • 0%,50%,100%: là các thuộc tính css cho từng giai đoạn, ở đây mình sử dụng thuộc tính color để đổi 2 màu trắng và cam thay đổi nhau
  • 1s : là thời gian chuyển động (1s = 1000ms)
  • infinite : để cho animation luôn chuyển động (có nghĩa là nó sẽ nhấp nháy mãi)
a code cho em một dòng nhấp nháy mãi với tks a, em chưa hiểu lắm ạ ==
 
Top Bottom