css - 仅显示 block 的前 25%

Question

我有一些使用 css3 生成的形状。我只想显示 block 的一部分，例如:上面的 25% 或底部的 25%。我如何实现这一目标？

例如:在 http://jsfiddle.net/HNyHM/1/ ;我只想显示上面的 25%。

Answer 1

检查这个。 http://jsfiddle.net/LB8mC/

将您的 CSS 形状包裹在一个 div 中，为其指定您想要显示形状的高度和宽度。然后相对于 wrapper 绝对定位形状。

这是我在 fiddle 中使用的内容。

  .shape-wrapper {
        position:relative;
        overflow:hidden
        height: 25px;
  }



  .shape-wrapper > div {
        top: -25px;
        left: -25px;
     }

您可以继续更改子 div 的位置(前 25% 或后 25%，就像您使用 JS 询问的那样)。