首页 >web前端 >html教程 >一个图片如何跨越2个不同背景颜色的Div?_html/css_WEB-ITnose

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

WBOY
WBOY原创
2016-06-24 11:36:271408浏览

如图所示,想在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>

css3,,,渐变。。。

声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn