问题标签 [css-shapes]

我注意到许多网站通过使用以下内容来指示您所在的页面或选项卡：

如您所见，有一个小箭头表示页码。这如何使用纯 CSS 来完成，或者大多数网站是否使用 div 的背景图像，他们使用 background-position 属性设置位置？这似乎是一种相当普遍的技术，因此上述似乎不太可能。

您可以在此处和此处查看其他示例。如果解决方案可以水平和垂直旋转，那就太好了。

I want to create two divs which are floated left to each other, however with a slanted angled border separating them. I've attached a picture to demonstrate what I mean.

Does anyone know if something like this is possible with CSS (cutting off the content with an overflow:hidden I guess)

These divs need to contain images that get cut off by the border, here is an example :

我需要在一侧创建带有三角形的按钮（例如http://css-tricks.com/triangle-breadcrumbs/），带有线性垂直渐变和边框，并且我想使用纯 CSS3。如果我需要45度的“三角形”也没关系，我只是这样写

并将该伪元素的一半隐藏在 .button 下（因此只有另一半可见，如三角形）。

但是如果我需要另一个角度（例如更陡峭） - 我无法使用标准的 XY 旋转和缩放。我可以使用例如 2 个 div，一个用于三角形的上半部分，一个用于底部，但边框和渐变可能存在问题。

也许可以使用带有色标的多个渐变来做到这一点？

我一直纠结于如何为设计机构提供的这些倒置弯曲选项卡编写 CSS 代码。

见这里： http: //max-guedy.com/images/tab.png

我想在这个图像上创建一个丝带效果（图像的红色部分）：

当我尝试创建带边框的箭头效果时，对象的形状被完全破坏：

HTML 代码：

到目前为止的 CSS 代码（没有尝试创建箭头）：

知道如何创建这个吗？

我正在尝试在10px by 10px气泡的右侧创建一个箭头，但我看不到它。到目前为止，我有：

CSS：

HTML：

路易斯：

有没有办法用 CSS 和 HTML 创建一个尖锐的平角？

像这样的东西：

我正在研究一个需要两个三角形来保存背景图像并成为链接的项目。

这是我想要两个三角形的模型。

目前，我只有两个跨越 900x600 的 div，每个三角形作为背景图像。我现在遇到的问题是我无法将鼠标悬停在 Cinema div 的透明部分上以到达照片 div。

我可以用 css3 三角形完成这个设计并设置它们的背景图像吗？我一直认为自定义形状是由边框组成的，带有边框颜色。

是否可以使用 css3 三角形，如果可以，有人可以帮我编写代码吗？

这是我目前拥有的。

有没有办法用css3创建插入边框半径？（无图片）

我需要这样的边界半径：

我一直在尝试用 CSS 制作这个形状。

理想情况下，它将跨越浏览器窗口的整个长度，并可能延伸到视野之外以支持更大的屏幕，并且还可以居中以使角度不会改变。

任何人有任何解决方案？

另外我认为我可能会遇到角度混叠的问题。我可能需要求助于使用图像。虽然想使用CSS。

** 图像拼写错误。（无限期并非不可避免）