てがきノートでは、モバイル状態の時に背景と同じ柄がヘッダーメニュー入るようになっております。

そうでない場合ですと以下のようにまとまりのないデザインとなるためです。

しかしながらグローバルナビ背景色がある場合は必要がない場合もあります。
そのため、モバイル状態の時に背景と同じ柄がヘッダーメニュー入らないようにするために以下のCSSを適用してください。
モバイル状態の時に背景と同じ柄がヘッダーメニュー入らないようにする方法
タイムラインのタイトル
- ステップ1外観 > カスタマイズをクリック
WordPressにログインして、ダッシュボードで外観 > カスタマイズの順にクリックします。
- ステップ1追加CSSをクリック
カスタマイズの画面から追加CSSをクリックします。
- ステップ1CSSを挿入
CSSの入力欄に↓のコードをコピーして貼り付けます。
@media screen and (max-width: 1023px){ #navi .navi-in > .menu-mobile li { background: none; background-image: unset; border: none; } }
- ステップ4公開をクリック
左上にある公開をクリックします。
これで完了です!
ビフォーアフター
モバイル状態の時に背景と同じ柄がヘッダーメニュー入らないようにした時のビフォーアフターは以下となります。
CSS適用前

CSS適用後

コメント