Làm thế nào để tạo: CSS mũi tên

Học cách sử dụng CSS để tạo mũi tên.

Mũi tên phải:

Mũi tên trái:

Mũi tên lên:

Mũi tên xuống:

Làm thế nào để tạo mũi tên

Bước 1 - Thêm HTML:

<p>Ánh phải: <i class="arrow right"></i></p>
<p>Ánh trái: <i class="arrow left"></i></p>
<p>Ánh lên: <i class="arrow up"></i></p>
<p>Ánh xuống: <i class="arrow down"></i></p>

Bước 2 - Thêm CSS:

.arrow {
  border: solid black;
  border-width: 0 3px 3px 0;
  display: inline-block;
  padding: 3px;
{}
.right {
  transform: quay (-45deg);
  -webkit-transform: quay (-45deg);
{}
.left {
  transform: quay (135deg);
  -webkit-transform: quay (135deg);
{}
.up {
  transform: quay (-135deg);
  -webkit-transform: quay (-135deg);
{}
.down {
  transform: quay (45deg);
  -webkit-transform: quay(45độ);
{}

Thử ngay