超便利なCSSを使って固定サイドバー(スティッキーサイドバー)を作ろう!

Поділитися
Вставка
  • Опубліковано 14 жов 2024
  • 画面をスクロールしていくと任意の位置でサイドバーを固定したいことがよくあります。一見どうやってコーディングするのか難しそうに思いますが、実はとても簡単です。
    知っておくだけで便利で効率的なCSSはたくさんありますが、今回はスティッキーサイドをコーディングするときに便利なCSSをご紹介します。
    フレックスボックスの動画
    Flexbox(フレックスボックス)を徹底解説 vol.1
    • 【CSS/コーディング解説】Flexbox(...
    Flexboxのflex:1 1 auto;とは?フレックスボックスを徹底解説 vol.2
    • 【CSS/コーディング解説】Flexboxの...
    === 動画学習サービス「unazuki」
    Web制作を学べる動画学習サービスを運営しています。
    unazuki.online/
    ・JavaScriptコース
     unazuki.online...
    ・WordPressコンプリートコース
     unazuki.online...
    ・HTML & CSSコース
     unazuki.online...
    === SNS
    ■ Twitter: / life_toshindai
    === 経歴
    Webデザイナー・エンジニア
    〜 2013 自動車メーカー系の企画職
    2014 〜 フリーランスWebデザイナー
    2016 〜 法人化
    -------------------- 簡単な自己紹介
    都内でWeb制作をやっています。
    苦労した経験をもとに、
    UA-camでは過去の自分が欲しかった
    知識・技術・マインドなどをスライドやデモ解説で発信しています💪
    🏋️‍♂️活動
    WordPressやWebデザイン講座など有益な情報を発信。
    初心者向けの動画〜超実践向けの動画まで多数公開しています。
    再生リストも作っているのでよろしければご覧ください。
    ✈️出身
    福岡県
    ---------------------------
    Webデザイナーとして活躍される方の
    知的好奇心・技術的向上心に少しでもお役に立てたらいいなと思っています
    (`・ω・´)ゞ
    詳しくはチャンネル概要欄もご覧ください。

КОМЕНТАРІ • 5

  • @hikkymama
    @hikkymama Рік тому

    とても分かりやすい説明をありがとうございます!私はWordPressでブログを書いてますが、サイドバーが固定できたらいいのにと常々思っていました。もっと練習してWordPress内のコードを変えたり装飾をかえたりできるようになりたいです!

    • @web5096
      @web5096  Рік тому +1

      ありがとうございます!
      意外と簡単にできちゃうので便利ですよね!

  • @ayakaymym334
    @ayakaymym334 Рік тому +2

    学校の先生より分かりやすすぎて何故学校に通ってるのか...🥲

  • @風花月兎
    @風花月兎 2 роки тому

    flexの使いかた(スティッキー)がよくわかりました。
    作成途中のサイトにサイドバーを組み込む荒業(''◇'')ゞも成功しました。ありがとうございます!

  • @tume1124
    @tume1124 2 роки тому

    便利なこと聞きました。ありがとうございます/