Chia sẻ code nút Button trong HTML CSS

Vi dụ : Tôi đang dùng Wordpress và sử dụng theme Flatsome để làm website của mình

muốn thêm nút button này thì làm như sau :

Trên giao diện Flatsome , chọn Theme Options

Sau đó chọn tiếp , CSS bổ sung

Dán đoạn code sau vào như ảnh , sau đó bấm đăng.

Code CSS:

/* nut button */

.parentContainer {

text-align: center;

}

.button {

background-color: #DD3333;

border: none;

color: white;

padding: 5px 10px 5px 10px;

text-align: center;

text-decoration: none;

display: inline-block;

font-size: 12px;

margin: 2px 2px;

cursor: pointer;

}

.button {

-webkit-transition-duration: 0.4s;

transition-duration: 0.4s;

}

.button:hover {

background-color: #ff0000;

color: white;

}

.button {

border-radius: 5px;

}

Tiếp theo, ta thêm 1 text và copy đoạn code html sau vào để hiển thị nút Button

code html :

</div>

Các bạn có thể thực hành trên : https://codepen.io/pen/

Chúc các bạn thành công !