-6
A
ответ
0
вы можете сделать это с clip-path: polygon
div {
background: #666;
height: 100px;
width: 200px;
-webkit-clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
clip-path: polygon(75% 0%, 100% 50%, 75% 100%, 0% 100%, 25% 50%, 0% 0%);
}
<div></div>
0
Использование псевдо элементов, вы могли бы сделать это таким образом.
div {
position: relative;
background: red;
width: 150px;
height: 80px;
}
div:before,
div:after {
content: "";
position: absolute;
width: 40px;
}
div:before {
background: red;
border-top: 40px solid transparent;
border-bottom: 40px solid transparent;
border-left: 40px solid white;
}
div:after {
border-top: 40px solid transparent;
border-bottom: 40px solid transparent;
border-left: 40px solid red;
left: 100%;
}
<div></div>
0
Использование псевдо элементов Я создать стрелку. пожалуйста, проверь это.
.arrow {
border-top: 1px solid #333;
border-bottom: 1px solid #333;
padding-top: 5px;
height: 37px;
width: 60px;
}
.arrow:after {
content: '';
display: inline-block;
margin-left: 45px;
width: 30px;
height: 30px;
border-top: 1px solid #333;
border-right: 1px solid #333;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
}
.arrow:before {
content: '';
display: inline-block;
margin-left: -15px;
width: 30px;
height: 30px;
border-top: 1px solid #333;
border-right: 1px solid #333;
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
transform: rotate(45deg);
position: absolute;
}
<div class="arrow"></div>
Смежные вопросы
- 1. Получить DIV, который имеет OnClick
- 2. Как создать вогнутую форму границ вокруг div?
- 3. Нужно создать форму div, как в примере
- 4. Как создать форму Recurly.js с элементами div?
- 5. Как создать форму регистрации Mailchimp div?
- 6. iPhone: создание UIBarButtonItem, который имеет форму стрелки
- 7. Представление Gameworld, который имеет неправильную форму
- 8. Как показать зарегистрированный div на div, который имеет изображение
- 9. Как разместить div под другим div, который имеет поплавок: right
- 10. Как сделать дочерний div выше родительского div, который имеет «переполнение»?
- 11. Как создать CGColorSpaceRef, который имеет формат RGBAh?
- 12. Заполнение div файлом php, который обрабатывает форму
- 13. Как создать форму входа?
- 14. Как создать треугольник, который можно щелкнуть div?
- 15. Установка CSS к IMG внутри DIV, который имеет класс внутри DIV, который имеет идентификатор
- 16. Найти ближайший DIV, который имеет определенный класс
- 17. Изменить содержимое div, который имеет уникальный класс
- 18. Как найти порт с IP-адреса, который имеет форму 192.168.1.98,193,148
- 19. Как создать контактную форму?
- 20. Как создать форму из модели, которая имеет ListProperty
- 21. Как создать форму бланков?
- 22. Как изменить форму div
- 23. Текст в div, который имеет непрозрачность 0,5
- 24. HTML/Javascript form - Как создать новый элемент div, который накладывается?
- 25. ASP.NET MVC2 - Как создать форму?
- 26. Как создать форму?
- 27. Как .грузить() в div, который имеет ссылку на функцию
- 28. Позиция div под div, который имеет абсолютную позицию
- 29. Stretch div to div, который имеет фиксированную ширину
- 30. Как создать «заполнитель» для DIV, который действует как текстовое поле?
Добро пожаловать! Пожалуйста, смотрите: [ask] | [mcve] | [Помогите]. –
Лучше вы должны сослаться на эту [ссылку] (http://code-chunk.com/chunks/543df4c394758/bootstrap-arrow-shaped-buttons) –
Я думаю, что это самый ленивый запрос о помощи, который я когда-либо видел на этом сайте. – 1252748