ヘッダー画像の上に枠線を入れたい

PR 2018/8/17

このトピックには8件の返信、2人の参加者があり、最後にかなちゅうにより8年、 1ヶ月前に更新されました。

8件の返信スレッドを表示中

投稿者

投稿
- 2018年8月11日 9:17 PM #60637
  
  かなちゅう
  ゲスト
  
  タイトルのままですが、ヘッダーに画像を使っていまして、その上に枠線のようなものを追加したいと思っています。CSSでできることなのか、方法など教えていただければ幸いです。
- 2018年8月12日 9:59 PM #60640
  
  わいひら
  キーマスター
  
  そういったカスタマイズならCSSでできると思います。
  ただ、実際のソースコードを見たいので出来ればカスタマイズ対象ページのURLを提示していただければと思います。
- 2018年8月13日 8:35 AM #60641
  
  かなちゅう
  ゲスト
  
  お世話になります。
  
  http://lp.mrswatanabe.jp/
  
  こちらが対象ページになります。
- 2018年8月13日 9:45 PM #60643
  
  わいひら
  キーマスター
  
  URLを見てみたんですが、ヘッダーに画像が使われていないっぽいんですけど、どの部分のことでしょうか？
- 2018年8月14日 8:26 AM #60647
  
  かなちゅう
  ゲスト
  
  すみません。
  
  画像が消えていました。
  
  トップバナーを追加しました。
- 2018年8月15日 11:40 PM #60655
  
  わいひら
  キーマスター
  
  画像の上に枠線ということなので、以下のようにするということでしょうか。
  
  単に、画像の上といっても、画像の上側なのか、画像の上辺なのか、レイヤー上の上層なのか．いろいろな意味にとれます。もし違うようでしたら、もう少し詳しく説明をお願いします。
- 2018年8月16日 10:32 AM #60656
  
  かなちゅう
  ゲスト
  
  説明不足ですみません。
  
  イメージとしては、こんな感じです。
  
  こちらは、ワードプレスの管理画面なので、黒色になっていますが、一般の方が見る通常画面でも、黒の部分を背景色（ピンク）と同じにして、ヘッダー画像の上にピンクを付け加えたいと思っております。
- 2018年8月16日 10:52 PM #60657
  わいひら
  キーマスター
  それだったら、枠線ではなくて背景色が見えるように余白を入れれば良いのではないかと思います。
  子テーマのstyle.cssに以下のコードを貼り付けるといけるかと思います。
```
#h-top {
    margin-top: 10px;
}
```
  幅などは数値を変更して調節してください。
- 2018年8月17日 8:03 AM #60659
  
  かなちゅう
  ゲスト
  
  イメージしていたものを作ることができそうです！
  
  margin-top: 10px;の数字を調整して、
  見やすくしてみたいと思います。
  
  このたびはありがとうございました。
投稿者

投稿