•
Created by user-wytumoi 4 year(s) ago

CSS tạo hình tam giác

Mình cần tạo một biểu tượng hình tam giác đều trỏ xuống dưới (để khi click vào thì sẽ xổ ra một menu). Có cách nào mà chỉ cần sử dụng CSS để làm việc này không vậy mọi người?

1 Answer(s)

Hau Van Hau Van •

Bạn có thể làm một thủ thuật nhỏ với html và css, căn chỉnh border của thẻ <span> để có kết quả như ý:

<!doctype html>
<html lang="en">
<head>
    <style type="text/css">
    .arrow-down {
        display: block;
        width: 0;
        height: 0;
        border: 40px solid #333;
        margin: 0 auto;
        border-bottom-width: 0;
        border-right-color: transparent;
        border-left-color: transparent;
    }
    </style>
</head>
<body>
<div style="text-align: center; margin: 30px auto">
    <span class="arrow-down"></span>
</div>
</body>
</html>
Content must be at least 100 characters

Add Image

Upload image from computer or from URL.
Maximum 2Mb.

Related Discussion

Trending Discussions