ホームページ > 記事 > ウェブフロントエンド > border_html/css_WEB-ITnose内のオフセットのCSSメソッドについて
border_html/css_WEB-ITnose内のオフセットのCSSメソッドについて
- WBOYオリジナル
- 2016-06-21 09:13:223687ブラウズ
写真に示すように:
1 には白い左側の境界線があります。
2 白い左側の境界線が数十ピクセルを青に移動します
CSS を使用して 2 の効果を実現するにはどうすればよいですか?
border-left:1px #fff Solid; を使用しました
しかし、境界線を内側に移動する方法がわかりません
ディスカッションへの返信 (解決策)
div を使用して線を定義します
2 div?
1 つは青い背景で、もう 1 つは境界線のある div です
または背景画像が白い線の div です
<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>页面名称</title><style type="text/css">#box { width: 200px; height: 100px; background-color: #00f;}#box:before { content: ""; display: block; height: 100%; margin-left: 50px; border-left: 1px solid #ff0;}</style></head><body><div id="box"></div></body></html> margin-left を使用してください。 div全体を置く { margin- left:10px;}
3階の方法は非常に簡単です
CSS3を使用すると、絶対位置に白の要素を追加することもできます
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。