一个图片如何跨越2个不同背景颜色的Div？_html/css_WEB-ITnose

WBOY

Release： 2016-06-24 11:36:27

Original

1404 people have browsed it

如图所示，想在2个不同颜色的层间放个图标，黑白相邻的层不能用黑加白的图片做背景图片。
这个该如何实现？

回复讨论(解决方案)

CSS3 渐变

<!DOCTYPE html><html><head>  <meta charset="utf-8">  <title>JS Bin</title>  <style>    #box{      position:relative;      width:100px;      height:0;      border-top:25px solid #000;      border-bottom:25px solid #fff;    }    .img{      position:absolute;      top:-50%;      margin-top:-12.5px;      left:50%;      margin-left:-12.5px;      width:25px;      height:25px;      background:red;      border-radius:25px;    }  </style></head><body>  <div id="box">    <div class="img"></div>  </div></body></html>

Copy after login

css3，，，渐变。。。

Related labels：

一个图片如何跨越2个不同背景颜色的Div？

source：php.cn

Previous article：html中元素动态生成导致重叠引起布局错乱_html/css_WEB-ITnose Next article：为什么XHTML大于号不转译也能识别？_html/css_WEB-ITnose

Statement of this Website

The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn