Пренасяне на CSS формуляри на следващото ниво

Как да създадете многоъгълник

В допълнение към прости фигури като кръг и триъгълник, можете да създадете и многоъгълници - фигури с много страни (обикновено 5 или повече), като петоъгълник и шестоъгълник. Ще ни трябва CSS функцията polygon (), която приема множество стойности, разделени със запетаи. Стойностите са координати:

В горния код са добавени 5 координати, които образуват петоъгълник. Ако добавите още една координата, формата ще се превърне в шестоъгълник, седмоъгълник, осмоъгълник и т.н.

формуляри

Практически курс за оформление на адаптивен уебсайт от нулата!

Вземете курс и научете как да подреждате модерни уебсайтове в HTML5 и CSS3

Самото създаване на многоъгълник е много по-трудно от създаването на кръг или елипса, особено ако това е сложен многоъгълник с много координати. За наш късмет има много удобен инструмент, който прави създаването на CSS форми по-интуитивно.

Работа с редактора на CSS Shapes

CSS Shapes Editor е разширение за Chrome. След като бъде инсталиран, нов раздел Shapes се добавя към панела за разработчици в раздела Elements, вграден с други раздели (Styles, Computer и др.).