Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 25.03.2017, 22:09   #1
rudireg
Новичок
Джуниор
 
Регистрация: 25.03.2017
Сообщений: 1
По умолчанию Как нарисовать кнопку

Привет.
Задача нарисовать такую кнопку

То есть кнопка с надписью и три треугольника с правового края, у которых можно менять цвет, положение и так далее.

Требование к коду.
Разрешается добавлять классы для кнопки, и никаких вложенных блоков.
То есть код может быть таким:
Код HTML:
<a class="myClass1 myClass2 myClass3 ..." href="#">Моя ссылка</a>
Тут на помощь приходят ::before и ::after
Но он позволяют вставить 2 псевдо-элемента, а мне нужно 3 !!!
У кого какие идеи?
Прикладываю полный код
http://codepen.io/anon/pen/QpxOgL
rudireg вне форума Ответить с цитированием
Старый 26.03.2017, 22:17   #2
Naive
Раздолбайских Дел
Старожил
 
Аватар для Naive
 
Регистрация: 22.05.2009
Сообщений: 3,828
По умолчанию

верхний и нижний треугольник можно одной псевдой нарисовать
Alar, верни репу!
Naive вне форума Ответить с цитированием
Старый 27.03.2017, 17:34   #3
zomb1e
Новичок
Джуниор
 
Регистрация: 27.03.2017
Сообщений: 3
По умолчанию

Зеленый треугольник можно сделать бэкграундом, а верхний и нижний псевдоэлементами.
zomb1e вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как сделать такую кнопку (как фигура) ? OlgaRostov Помощь студентам 2 09.01.2016 13:10
Как сделать кнопку такую как у vksaver? Pro100Fant PHP 1 10.07.2012 09:30
как нарисовать прямые strateg66 Помощь студентам 0 20.11.2009 00:01
Как нарисовать картинку сбоку в меню как в Punto Switcher Crazyman Win Api 4 26.09.2008 18:13
КАК нарисовать круг Elmut Общие вопросы Delphi 5 27.05.2008 14:54