Как оказалось, нельзя так просто взять и нарисовать треугольник на чистом CSS. Флаг Чехии это очень хороший пример для тренировки рисования треугольников.
Нарисовать фон было простой задачай. Её я отработал на флаге России:
.cze-flag {
height: 200px;
width: 300px;
border: solid 1px #000000;
background: linear-gradient(to bottom,
white 50%,
red 50%);
}
Здесь всё просто. Размер флага 2/3 и фон. Половина белого и красного.
А вот с треугольником пришлось попотеть. В этих вашим интернетах нашел примеры отрисовки треугольников рамкой.
Пошаговый пример:
А вот с треугольником пришлось попотеть. В этих вашим интернетах нашел примеры отрисовки треугольников рамкой.
Пошаговый пример:
See the Pen Создание Треугольника by Sergey Zlomorda Drushchits (@Zlomorda) on CodePen.
Всё, теперь можно применить:
See the Pen Czechia flag by Sergey Zlomorda Drushchits (@Zlomorda) on CodePen.
Конечно, это не идеальное решение для отрисовки треугольников. Например, для флага Израиля такое решение не подайдёт. Но, мы здесь для того, чтобы учиться.
Всем добра!!
Комментариев нет:
Отправить комментарий