Bootstrap5でレスポンシブなウェブサイトを作ってみよう - HTML/CSS/Bootstrap5チュートリアル

[@8ちゃんねる-s5h]

ありがとうございます！！！paizaラーニングでhtml,css,bootstrapを学んだはいいものの全体の流れが全く分からず困っていました。ノーカットで見られるおかげで考え方まで何となく理解でき、タイピングすらできない自分でも完成まで行けました！！！

[@ゆきのぶ-e8r]

細かい解説ありがとうございます！ 非常に有益でした。

[@user-pk7df8ll6g]

めっちゃ分かりやすかったです！ありがとうございます！！

[@RERO0811]

はじめて視聴しました。めちゃくちゃわかりやすいです。レスポンシブサイトを０からコーディングするのが難しく、あらためてbootstrapのすごさを感じました。Udemyでもぜひbootstrap編を作ってください！これからも応援しています。

[@best4life098]

こんにちわ！　前回reactのTODOリストがわかりやすかったので、今回も動画お世話になります。ブートストラップしてはいたんですが、今回練習で実装してみると、雰囲気あるしお手軽に作れるのでフレームワーク大事だと思いました。　今回もわかりやすい動画をありがとうございます😄

[@mitsubachik]

カバー写真がスクロールするz-indexを学びたくてやってみましたが、Bootstrapのレビューができたのと、CSSのeffectが学べたのでとても勉強になりました！これをReactで応用してみたいと思います。

[@須永-m7g]

Bootstrapの模写練習にかなり良い動画ですね。 僕個人的にはこちらの動画を検索上位に出して欲しいくらいです。 とても参考になりました。ありがとうございます。

[@y-2_kg]

大変勉強になります！ ぜひtailwind css版もアップして欲しいです！

[@nagai_net]

自分もKZbinをやっていますが1本動画撮って編集するのにどの位時間がかかるのか見当がつきます。視聴者の為にここまでやって頂いてありがとうございます。

[@私は大砲よ-l9m]

すてき

[@どれあす]

はじめまして。 とても勉強になる動画をありがとうございます！ 質問なのですが、動画の最初( 2:28 辺り)などで長い分を要素？ごとに改行する動作があったと思うのですが、どうしたらできますか…

[@丸山稜-c4s]

うわー！どうしてもproject sectionのところで、positionをrelativeにしても画像の上に文字がきません・・・。 何か考えられる原因はあるでしょうか？ 先生の動画でいうと、1:02:00あたりです。 一応自分が書いたコードを載せておきます。 HTML Projects Recent Project Lorem, ipsum dolor sit amet consectetur adipisicing elit. Minus, voluptatem! project title website Design CSS /* project section */ .project{ position: relative; } .project .ovarlay{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(37, 39, 71,0.7); }

[@丸山稜-c4s]

自己解決しました！、overlay　がovarlayになってました。引き続き頑張ります！

[@programming_tutorial_youtube]

@@丸山稜-c4s すぐに対応できなくてごめんなさい！自己解決できたのならよかったです。 また何かありましたらコメント下さいね💪勉強熱心ですばらしいと思います👏

[@丸山稜-c4s]

@@programming_tutorial_youtube 素早い返信うれしいです！ 実は最近困っていて、こういう素晴らしいサイトが作れるのは先生のを真似しながら（ほぼ写し）だからできるのですが、「一人で一からやろう」ってなったら全くできません。なにかいい練習方法はないでしょうか？

[@programming_tutorial_youtube]

@@丸山稜-c4s デザインから1からやるとなるとレベルが結構に上がってしまうと思います。 模写で作れるとしたら、次はデザインと構成だけを見て、コードの模写をせず自力でコーディングするといいと思います。思い出す作業をしないといけないので、知識がより定着するはずです。分からなければググって解決します。 もっと近道するなら、実際に働いてみるという手もありです。まだ就職の時期でないのなら、いろんなサイトのポートフォリオを用意しておくというのも手ですね🙂 (今少し手が空いてないのですみません、あとで返信します)

[@programming_tutorial_youtube]

@@丸山稜-c4s 模写をする際に、コードの意味は理解できるているでしょうか。もし不安ならばコード模写したあとに「独り言で誰かに分かりやすくコードを説明」してみてください。もし、詰まるところがあれば完全に理解していないということです。 理解ができれば自由自在に扱えるよいになります。あとは適度な運動が大事です。勉強の合間に15分でもいいので散歩してみるといいかもしれません。 空白の時間を作ることでより知識が定着します。参考までに

[@Mtsaku]

初めまして、 動画を参考に勉強させていただいてます。 質問失礼します。 プロジェクトセクションの、各カードをクリックしたら、 リンクに飛ぶようにしたいのですが、どのようにしたら出来ますでしょうか？ 自分なりに調べてやってみたのですが、うまく行かず、 教えていただきたいのですが、 よろしくお願いします。

[@大介北舎]

DWで同じように打ち込んでいますがCSSの::afterがうまく反応しません。また指定固定の--も全くききませんでした。何故でしょうか。DWにBS5とjq3.6.4バージョンを入れたからでしょうか

[@ぐりどん-j1y]

bodyタグ、aタグといったHTMLタグにstyle.cssが効きませんでした。（Bootstrapのリセットである_reboot.scssの影響ぽいです。自分だけでしょうか？） クラスにはcssがあたるので、class="body", .body　などとすることで対応しましたが、もっと良い方法があるんですかね・・・？

[@viaruru9468]

一点質問させていただきたいのですが、 footer sectionでbackground-color編集するのに敢えてcssで記述する理由がわかりません。その他、余白についてもですね...。 cssで加工するのか、htmlのタグでbootstrapを充てるのか。などbootstrapを使用するうえで決め事や一般的な書き方とかないのでしょうか。 コード量が多くhtmlのタグが長くなるものはcssで記述するとかありますか？

[@hacofit]

いつも動画拝見させていただいて勉強させてもらっています！ すみません。突然の相談で申し訳ないのですが、 Heroセクションの背景画像がスマホで見ると表示されなくなってしまって、、 何か考えられる原因はありますでしょうか？？

[@programming_tutorial_youtube]

いつもご視聴ありがとうございます。 画像パス指定ミスですかね、、

[@HANJOU_CHAKUSHO]

ちょっと変わってない？

[@programming_tutorial_youtube]

もしかしたらバージョンの変更で記述点が多少変わってるかもしれません...ご了承ください。