Question

我正试图在Div的右上角放一个“三角形”。不知怎的，我每次都搞砸了。

那是我的div：

<div class="gtcr_ttl_wllt_dash">
    <div class="db_ov_layer center">
      <h1 class="ttl_ammnt">Test Module</h1>
      <span class="prf_ttl">Hello There</span>
    </div>
</div>

在jsfiddle是一张照片和所有设置，除了鬼鬼祟祟的三角形。如果有人有空闲时间帮我解决这个问题..会很棒。

Answer 1

包装div的CSS：

.div-wrap {
    position: relative
}

三角形的CSS：

.triangle {
    display: block; (if not already a block element)
    position: absolute;
    top: 0;
    right: 0;
    left: auto;
}

快速小提琴： http://jsfiddle.net/92gvW/3/

Answer 2

这应该执行此操作，将最外面的div position:relative提供给功能区position:absolute，然后使用top和right进行修复

http://jsfiddle.net/92gvW/2/

编辑：并将功能区放在外部div中

编辑2：我第一次没有看到图像，有一些丑陋的css技巧我也做了三角形

http://jsfiddle.net/92gvW/4/

基本上是一个较大的黑色三角形上的小白色三角形，移动1px

创建一个css功能区

2 个答案: