回答編集履歴
2
文法の修正
test
CHANGED
@@ -18,7 +18,9 @@
|
|
18
18
|
|
19
19
|
|
20
20
|
|
21
|
+
この方法だと装飾用に余計なタグ要素を追加する必要が無く、シンプル&スマートに実装できるかとおもいます。
|
22
|
+
|
21
|
-
親要素の幅にかかわらず可変するのでレスポンシブにも対応してい
|
23
|
+
また、親要素の幅にかかわらず可変するのでレスポンシブにも対応しています。
|
22
24
|
|
23
25
|
|
24
26
|
|
1
文法修正
test
CHANGED
@@ -2,13 +2,15 @@
|
|
2
2
|
|
3
3
|
|
4
4
|
|
5
|
-
背景画像が敷かれたBOXを`div.bgImg`とした場合に、
|
5
|
+
まず、背景画像が敷かれたBOXを`div.bgImg`とした場合に、
|
6
6
|
|
7
|
-
`.bgImg`自体を`position:relative`でポジションの起点とし
|
7
|
+
`.bgImg`自体を`position:relative`でポジションの起点とします。
|
8
8
|
|
9
|
-
`.bgImg:before`の疑似要素に`border`をを付けたうえで、
|
10
9
|
|
10
|
+
|
11
|
+
次に、`.bgImg:before`の疑似要素に`border`で枠線をつけて、
|
12
|
+
|
11
|
-
`position:absolute`
|
13
|
+
`position:absolute`、`top` `right` `bottom` `left`を使って`.bgImg`が持つ最外枠からのピクセル数を指定することで、画像の内側に枠をつけます。
|
12
14
|
|
13
15
|
|
14
16
|
|