Rumah >hujung hadapan web >html tutorial >一个图片如何跨越2个不同背景颜色的Div?_html/css_WEB-ITnose

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

WBOY
WBOYasal
2016-06-24 11:36:271421semak imbas

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

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn