Тёмный

HTMLとCSSでオシャレなナビゲーションサイドバーの作り方 - HTML/CSS/Javascript - 

Shin Coding Tutorial
Подписаться 41 тыс.
Просмотров 17 тыс.
50% 1

#HTML #CSS #Javascript #サイドバー #ナビゲーションバー #ウェブサイト #チュートリアル #入門
❤️ チャンネル登録: / @user-hl9uv6cv7k
\ShinCode_Campでプログラミングを楽しもう/
幅広いプログラミングの知識を得るための動画プラットフォーム
🎁僕が作成したUdemy講座が見放題
🎁分からない箇所は質問し放題
🎁フルスタック技術が学べる
🎁コミュニティ機能付き
🎁いつでも解約可能
↓↓↓↓↓
code-s-school-5bc2.thinkific....
★今回のソースコード:github.com/Shin-sibainu/navig...
今回はHTMLとCSSとvanillaJavascriptを使ってオシャレなナビゲーションサイドバーを作ってみました。クリックするとその箇所だけ背景色が加わり、さらにボーダーに丸みをつけてお洒落さを表現しています。addとremove関数を上手く使いこなしてみましょう。
この動画が良いと思ったらチャンネル登録よろしくお願いします。
バグや分からないことがあればコメント欄、またはDMでご質問ください。
★私のTwitter: / shin_engineer
❤️React×TrelloチュートリアルのUdemy92%割引クーポン:shincode.info/2021/12/31/udemy...
❤️Three.js入門のUdemy94%割引クーポン:
shincode.info/2021/12/31/udemy...
❤️React×FirebaseでTwitterクローン構築講座Udemy94%割引クーポン:
shincode.info/2021/12/31/udemy...

Опубликовано:

 

13 дек 2021

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 15   
@Pentagon5-ch
@Pentagon5-ch 9 месяцев назад
めちゃくちゃやりたかったことをやりやすいペースでわかりやすく教えてくれるところが好きです!
@python3343
@python3343 2 года назад
いつもわかりやすい!
@si-qg4dc
@si-qg4dc Год назад
とても参考になりました!ソースコードを参考にプルダウン形式に変更してみようと思っていますが、なかなかうまくできません。 プルダウン形式に変更する際の解説動画も出たりしませんか?😅お願いします🙇
@soci0926
@soci0926 2 года назад
投稿ペースが早い!!
@user-hl9uv6cv7k
@user-hl9uv6cv7k 2 года назад
コメントありがとうございます。 なるべく時間がある内に投稿しようかなと笑
@itsKatzen
@itsKatzen 2 года назад
Idk but I easily understand this Japanese tutorial video rather than other English tutorial even i when don't understand japanese pretty much Nice video!
@user-hl9uv6cv7k
@user-hl9uv6cv7k 2 года назад
Thanks CHIN PONYA. Your words make me very happy:)
@syurahito9441
@syurahito9441 2 года назад
実際にサイドバーを押した時にそれぞれ別の要素を表示させたい場合は、どのようなコードになるのでしょうか? ボタンを押した際に要素を切り替えるサンプルコードとかがあれば教えていただけないでしょうか。
@user-hl9uv6cv7k
@user-hl9uv6cv7k 2 года назад
react routerのドキュメントを読んでみてください。ヒントが書かれているはずです。Reactのルーティングについても今後の動画で出すかもしれません。 knowbody.github.io/react-router-docs/
@Wi_antyobi
@Wi_antyobi Год назад
すごく参考になりました! こちらのサイドバーを固定して表示させたいのですが、どのようなコードになるか教えていただけないでしょうか…?
@user-hl9uv6cv7k
@user-hl9uv6cv7k Год назад
position: fixed;等でできないでしょうか、、
@alzkaai
@alzkaai 2 года назад
ナビゲーションバーはいいんですが真ん中に文章を表示させるにはどうすればいいですか?
@tume1124
@tume1124 2 года назад
子要素の文字のaタグにtext-align center:ですかね。aline-item :center 聞いてるならdisplay: flex;でjustify -content: centerでできるかもしれませんね。よくは知らないですけど場合によってはmargin: 0 autoかもしれないですね。
@alzkaai
@alzkaai 2 года назад
@@tume1124 ありがとうございます!
@sinnito4488
@sinnito4488 4 месяца назад
いきすぎパレード!
Далее
Новые iPhone 16 и 16 Pro Max
00:42
Просмотров 1,1 млн
Java Is Better Than Rust
42:14
Просмотров 95 тыс.
Less CSS Pre-Processor Tutorial
26:55
Просмотров 130 тыс.
Flexbox layout with sidebar and fixed footer
8:44
Просмотров 10 тыс.
この技術スタックは現代の魔法です。
21:27
Новые iPhone 16 и 16 Pro Max
00:42
Просмотров 1,1 млн