相关疑难解决方法(0)

是否有可能创建"CSS3 Transform Skew One Side"

我找到了一个解决方案,但它对我没用,因为我需要使用图像作为背景(而不是颜色)

#skewOneSide {
    border-bottom: 40px solid #FF0000;
    border-left: 50px solid rgba(0, 0, 0, 0);
    height: 0;
    line-height: 40px;
    width: 100px;
}

即使这个JsFiddle也没用(倾斜的区域应该是透明的)

嗨,我正在尝试在HTML和CSS中创建以下Angled Strip Look:

只有蓝色和紫色区域后面有白色.

我显然可以看到如何使用图像,但只有HTML/CSS呢？

这可能吗？

它在网站上使用 - www.africa.dating

我知道我应该有更多示例代码,但我实际上不确定从哪里开始所以我只有以下HTML:

小提琴:http://jsfiddle.net/e2dr5udr/3/

<div id="container">
    <div id="blue"></div>
    <div id="purple"></div>
</div>

#container {
    width: 100%;
    height: 100px;
    background-color: white;
    position: absolute;
}

#blue {
    width: 100%;
    height: 100px;
    background-color: blue;
    position: absolute;
} 

#purple {
    width: 100%;
    height: 100px;
    background-color: purple;
    position: absolute;
}

谢谢

假设我有一个容器 div，里面有两个 div。这是我想要的效果：

<div>
  <div></div>
  <div></div>
</div>

此外，我需要它具有响应性，宽度和高度以 % 或视口单位为单位。我需要用各种内容填充它们，有些内容甚至可能部分隐藏在这些 div 之一下。

我需要用html&css创建这个形状,(忽略灰色边框)

这是我的html:

<span class="bar-wrapper">
    <span class="bar first">&nbsp;</span><span class="bar last">&nbsp;</span>
</span>

我怎么能这样做,并让两个杆以这样的角度相遇？