タグ

ブックマーク / www.yukihy.com (2)

  • CSSで組んだドロップダウンメニューとスライドメニューを両立させたレスポンシブなメニューの作り方【コピペでOK】 - Yukihy Life

    以前、メニューバーをトグルメニューと両立してレスポンシブスタイルにするカスタムを書きました。 www.yukihy.com トグルメニューは、ボタンを押すと上下にスライドするようなものでしたが、 現在このブログでやっているみたいに、横からのスライドにして、なおかつPC版では子メニューも設定できるようにしてみたいと思います! カスタマイズを行う際は、必ず以前のコードをメモ帳などにバックアップをとっておくようにしてください。 実装図 注意点 カスタマイズ CSS HTML&jQuery HTMLにリンクを入れる その他のカスタマイズ 色を変える グローバルメニューの横幅を変えたい グローバルメニューとトグルメニューの変えるタイミングを変えたい まとめ 実装図 完成図はこんな感じです。ブラウザのサイズが広いときには、子メニューまで出せれる一般的なグローバルメニューで、 ブラウザサイズが狭くなると

    CSSで組んだドロップダウンメニューとスライドメニューを両立させたレスポンシブなメニューの作り方【コピペでOK】 - Yukihy Life
    asyst
    asyst 2016/02/15
  • 画像でなくcssで背景をつけてブログ記事を一気に読みやすくする方法 - Yukihy Life

    最近ブログを書くときに、背景色や枠で囲ったりすると一気に見やすくなるなあと思って使い始めています。 それどうやんねん?とのコメントをいただいたので、記事にしてみたいと思います(ネタ提供あざっす!)。 実例 どんな感じかと言うと、例えば下の図は昨日の記事 【お知らせ】当ブログで配布していたSNSボタンに関して重大なミスがありますので修正をお願いします - Yukihy Life なのですが、 ん〜、何か読みづらくないですか?? 普通に記事を書いていくと、改行するタイミングだったり、句読点の位置・太字ぐらいしかアクセントをつけることが無いと思います。 ましてや僕のブログ、誤字脱字がめちゃくちゃ多いんですよね。二ヶ月後ぐらいに「ぎゃーー!!」って気づくことも良くありげ。 そこで以下のように背景にちょっと色をつけてやると… このようにどこがURLでどこが説明なのかの判断が一瞬ででき、分かりやすいよ

    画像でなくcssで背景をつけてブログ記事を一気に読みやすくする方法 - Yukihy Life
  • 1