2

我想要实现的位于此处：http: //www.ppp-templates.de/tilability/ ..您会在滑块附近看到左右三角形，箭头应该在哪里......

现在我在这里设置了那个 div，白色背景http://teothemes.com/wp/。在那个网站上使用了背景图片，但我想通过 CSS 来做

这里有一些相关的东西，对于页脚三角形：在带有白色 bg 图像的 div 上制作一个具有透明背景的 CSS 三角形？

我试图做同样的事情，但它没有奏效..

任何帮助是极大的赞赏。

4

3 回答 3

2

您可以做的第一件事是创建两个背景与网站背景相同的正方形，然后45deg使用transform: rotate(45deg)供应商前缀旋转它们。然后只需将内容 div 设置overflow为hidden.

我刚刚创建的类似这样的东西：http: //cssdeck.com/labs/hggee4eg

于 2012-07-08T13:19:29.747 回答
1

在这里解释这个过程被证明是相当困难的，所以我创建了一个小提琴，它完成了实现这一目标所需的每个步骤，每个步骤都有一个小图例。

这是小提琴 - http://jsfiddle.net/NXmge/3/

编辑 - 我误解了这个问题。这是解决实际问题的方法：http: //jsfiddle.net/joplomacedo/UJyAY/

前一个小提琴仍然有用，因为它有助于理解我在第二个小提琴上做了什么。我也会尽快更新我的答案，因为我可以直接包含对我所做的事情的一般解释。

于 2012-07-08T13:37:49.213 回答
0

根据您希望实现的跨浏览器兼容性，有几个不同的 CSS3 类型选项可以让您将元素旋转 45 度。

但是，您链接到的示例仅使用了一个带有图形的大型背景图像：除了将其设置为容器背景之外，CSS 没有任何实现。

于 2012-07-08T14:36:18.267 回答