05-31　今日の改造

ヘッダーメニューの変更

Stinger3のオリジナル　ヘッダーメニューの変更をしています。
インストール直後のヘッダーメニューのデザインが物足りなく感じたのでCSSで編集してみようと思いました。

上の画像の通り、左詰めの文字だけだったので、背景に色を被せて尚且つ透かしを入れ、左右の行長いっぱいに伸ばしてみようと取り掛かりました。そして、編集後のメニューは下記の画像です。この画面ではマウスカーソルをヘッダー枠に載せない状態のヘッダーメニューです。

そして、マウスカーソルをヘッダー枠に載せた状態のヘッダーメニューが、下記の画像です。マウスカーソルを置いた状態では選択された項目の背景と赤 の3px でアンダーラインを付加しました。

難儀しました

ここにたどり着くまで、バックグラウンドやマージンの設定など夢にまで出てくる始末でした(笑)
後ほど追記いたします。