ホームページ >ウェブフロントエンド >htmlチュートリアル >背景色の異なる 2 つの Div に画像をまたがるにはどうすればよいでしょうか? _html/css_WEB-ITnose

背景色の異なる 2 つの Div に画像をまたがるにはどうすればよいでしょうか? _html/css_WEB-ITnose

WBOY
WBOYオリジナル
2016-06-24 11:36:271407ブラウズ

図に示すように、異なる色の 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 までご連絡ください。