css - 纯 CSS 功能区,简单的方法?

标签 css

<分区>

我想使用 CSS3 实现此功能区:

enter image description here

有没有办法在 CSS 3 中创建“扭曲的”矩形,或者我应该选择三 Angular 形? 我对 CSS3 很陌生。实现此功能区的最简单方法是什么?

最佳答案

我在这个工具上运气不错:http://cssarrowplease.com/

在您的情况下,您将同时拥有一个 :before 和一个具有不同箭头配置的 :after

最后,请注意,要获得尖箭头,请在 4 的一侧使用边框。但要获得对 Angular 线,您只需在 2 个相邻边使用边框,而在另一边不使用边框。

祝你好运!

关于css - 纯 CSS 功能区,简单的方法?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19985188/

相关文章:

javascript - 在父级悬停时更改 img src

css - 子菜单上的 Linkcolor 继承了 :hover one

javascript - 仅在页面提交后显示具有透明背景的加载图像

javascript - 如何水平增加此div的背景

html - CSS 图像悬停不起作用

html - 使用 css 更改背景图像的不透明度

javascript - 当浏览器不支持视频格式时显示自定义错误消息

javascript - Dom 元素变化通知

jquery - 结合 jQuery 延迟和 windowTimeout 以实现基于 CSS 的淡入淡出

php - 在括号实时预览中显示更多信息(边距、填充等)