Question

所以这是三角形：

#header-triangle-right {
    position: absolute;
    float: right;
    top:0px;
    right:0;
    z-index: 0;
    overflow: hidden;
    width: 0;
    height: 0;
    border-top: 400px solid transparent;
    border-right: 1000px solid #000000;
}

那么，由于'border'不支持百分比，我如何使这个三角形伸展100％的文件呢？

Answer 1

我不知道有任何纯CSS方法可以做到这一点，但如果你使用jQuery没问题，你可以这样做：

var windowWidth  = $(window).width(),
    windowHeight = $(window).height();

$('#header-triangle-right').css({
    'border-top'   : windowHeight + 'px solid transparent',
    'border-right' : windowWidth + 'px solid  #000'
});

jsfiddle：http://jsfiddle.net/TzM5m/

CSS Triangle，可以延伸100％的文档

1 个答案: