• Страница 1 из 1
  • 1
Форум » Web-Раздел » Начинающему вебмастеру » Создает треугольник на чистом CSS (Как сделать треугольники на чистом CSS)
Создает треугольник на чистом CSS
Kosten
Дата: Воскресенье, 2019-06-02, 01:18 | Сообщение 1
Оффлайн
Администраторы
Сообщений:25108
Награды: 57


Тема для кого то не сильно востребованная, до того момента, когда вам потребуется треугольник на сайте, который основном задействован под функций. И здесь несмотря на то, что сделать треугольники на чистом CSS создать не сложно, но все же нужно и это знать.

Цвет границы, изначально является оттенком треугольника. Сторона точек кончика треугольника соответствует противоположному border-*свойству. Например, цвет на border-top означает, что стрелка указывает вниз.



HTML

Код
<div class="snulogedas"></div>

CSS

Код
.snulogedas {
    width: 0;
    height: 0;
    border-top: 20px solid #232222;
    border-left: 20px solid rgba(0, 0, 0, 0);
    border-right: 20px solid rgba(0, 0, 0, 0);
}

Поэкспериментируйте с px значениями, чтобы изменить пропорцию треугольника.

Демонстрация
Прикрепления: 0554921.png(0.2 Kb) · dsamuv.zip(1.4 Kb)
Страна: (RU)
Форум » Web-Раздел » Начинающему вебмастеру » Создает треугольник на чистом CSS (Как сделать треугольники на чистом CSS)
  • Страница 1 из 1
  • 1
Поиск: