css - 如何让div透明？

Question

CSS 是否提供任何选项以在 Angular 落显示背景图像透明。

而不是在 ( DEMO ) 中显示白色背景

避开白色区域

#octagon {
    width: 100px;
    height: 100px;
    background: red;
    position: relative;
    margin: 50px auto 0;
}

#octagon:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    border-bottom: 29px solid red;
    border-left: 29px solid red;
    border-right: 29px solid #eee;
    width: 42px;
    height: 0;
}

http://jsfiddle.net/L8JUJ/4/

Answer 1

Working Fiddle

对边距进行了细微的更改和调整。

CSS:

body{
    background: url(http://placehold.it/350x150&text=FooBar1) repeat;
}
#octagon {
    width: 100px;
    height: 71px;
    background: red;
    position: relative;
    margin: 99px 10px 0px 100px;
}

#octagon:before {
    content: "";
    position: absolute;
    top: -29px;
    left: 0;
    border-bottom: 29px solid red;
    border-left: 29px solid red;
    border-right: 29px solid transparent;
    width: 42px;
    height: 0;
}