border_html/css_WEB-ITnose内のオフセットのCSSメソッドについて

WBOY
リリース: 2016-06-21 09:13:22
オリジナル
3724 人が閲覧しました

写真に示すように:
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を使用すると、絶対位置に白の要素を追加することもできます

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート