【CSS #1】基礎からちゃんと学ぶ CSS 入門!基本構文を抑えよう!【ヤフー出身エンジニアが教える初心者向けプログラミング講座】

Поділитися
Вставка
  • Опубліковано 2 лис 2024

КОМЕНТАРІ • 89

  • @MIクリエーションズ
    @MIクリエーションズ 9 місяців тому +2

    こんなにわかりやすい講座は初めてです!スピード感もありすばらしいです!

  • @田中太郎-i6o
    @田中太郎-i6o 4 роки тому +6

    先生の説明じゃcss全くわからなかったけどこの動画見たらスッキリわかりました。今の世代UA-camさえあればほとんどのことが無料でわかるけどこれこそ一番リーズナブル。
    どんどん活用きていきます!!

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

    Visual Studio Codeの動画とHTMLの動画をみました、これからCSSとJSの動画をみたいと思います! 色々HTMLやCSSやプログラミングを動画で見ましたが一番初心者にわかりやすいです! ありがとうございます

  • @bon-chan8799
    @bon-chan8799 3 роки тому +1

    単純なところでつまづいていたのですが、この動画を見て解決できました。ありがとうございます

  • @hiram5358
    @hiram5358 2 роки тому +2

    CSS入門:7コンテンツを全て拝見しました。章立てがとても見やすく、理解しやすかったです。現場での苦労感が伝わってきます。頑張ってレイアウト編も拝見したいと思います。Grid!楽しみです。ありがとうございます!

  • @きよせはいじ-z8l
    @きよせはいじ-z8l 4 роки тому +1

    最近htmlを始めて、cssの外部シートで詰まっていた所を解決できました。ありがとうございました。

  • @user-tf6dr7nc5v
    @user-tf6dr7nc5v 4 роки тому +8

    非常にシンプルでわかりやすくて助かります。ありがとうございます!

    • @shimabu_it
      @shimabu_it  4 роки тому +1

      良かったです。CSS基礎は既に作り終えて、今後は応用・実践編を考えております。基礎を学び終えたら、そちらも見てくださいね😊

  • @どんぐりチャンネル-q2h
    @どんぐりチャンネル-q2h 4 роки тому +8

    めっちゃ分かりやすくてためになります。

  • @tavernitysonw
    @tavernitysonw 4 роки тому +4

    待ってました!!✨

  • @zpzezn
    @zpzezn 2 роки тому +1

    勉強になります。自分にもできそうです。

  • @でこでこ-g2v
    @でこでこ-g2v 3 роки тому +1

    アラフォーです!
    ITの専門学校卒で三年間ほどSEしてましたが、それ以降全然違う職業に従事しておりました。
    自身でwebサイトを作ってみたいと思い、勉強中です!
    非常に分かり易くてとても助かります!

  • @ka-ml3ve
    @ka-ml3ve 4 роки тому +7

    いつも有益な講座を無料で公開して頂きありがとうございます!
    プログラマーになるため、まずはドットインストールとしまぶーさんの動画で学んでいきたいと思います^ ^

    • @shimabu_it
      @shimabu_it  4 роки тому

      ありがとうございますー!
      今後もたくさん学びになる動画を出していきます!😊

  • @ぴーぽー-r7m
    @ぴーぽー-r7m 4 роки тому +6

    めちゃくちゃ分かりやすい!

  • @dokkano_sato
    @dokkano_sato 2 роки тому +2

    自分は理解力ないんで
    大学の講義+この動画を観てます

  • @C4nsha
    @C4nsha 4 роки тому +6

    初心者に分かりやすい!

  • @yuru_6
    @yuru_6 2 роки тому +1

    すっごくわかりやすかったですー😭😭
    基礎の基礎がわからないので、助かります。

  • @バナナオキ
    @バナナオキ 4 роки тому +1

    見ました!
    最後まで見ますね!!

    • @shimabu_it
      @shimabu_it  4 роки тому

      いつもコメントありがとうございます!
      学びにしていってくださいね!😊

  • @ともあき-l4h
    @ともあき-l4h 4 роки тому +1

    とても分かりやすいです!

  • @武甕
    @武甕 5 місяців тому

    初めまして。すごく分かりやすいです。例えば、一度作成したサイトで、同じフォルダー・ファイル内で似たようなサイトを作成する場合、既存のCSSファイルにファイルを作成しないでリンクする方法を教えてください。

  • @vuvan2457
    @vuvan2457 4 роки тому +4

    初心者に分かりやすい!ありがとうございます!!!

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

    とても分かりやすく勉強させていただいてますが、1点質問があります。
    VSCの便利機能?で  と一発で入力できます。
    は、style.cssを呼び出すんだなと何となくわかるのですが、 rel="stylesheet" とは何なのでしょうか?
    ""で囲んでいるので文字列を指しているんだなと想像しますが、何処にもそのような記述が見当たりません。
    MDN抜粋:
    「rel は "relationship" を意味し、おそらく 要素の重要な機能の一つです。 - 値はこれを含んでいる文書にどのように関係するかを示します。」
    読み続けたら気を失っていました・・

  • @nickmatchn1
    @nickmatchn1 4 роки тому

    わかりやすい。本当にありがとうございました

  • @まーくん-s8f
    @まーくん-s8f 4 роки тому +1

    ありがとうございます😊
    cssが反映されなかったのが
    反映されました。
    ありがとうございます。😁

  • @hoangvan9788
    @hoangvan9788 4 роки тому +4

    初心者に分かりやすい

  • @tokumeiryo
    @tokumeiryo 4 роки тому

    すげーーーーーー分かりやすいです!!!
    有料級の動画!

  • @yasuda1229
    @yasuda1229 4 роки тому

    分かりやすい!

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

    kintoneでCSSを使っているのですが、
    詳細画面と編集画面でテーブルに入っているタイトル項目の幅を狭めようとしたのですが、編集画面だけできません。widthなど幅を使うものは使って、importantも使ったのですができませんでした。編集画面ではできないのでしょうか?ちなみに狭めようとしているフィールドはユーザー選択と組織です。

  • @guysweet5834
    @guysweet5834 4 роки тому +3

    分かりやすくて草
    最高です!

  • @seikai2749
    @seikai2749 4 роки тому

    今日から拝見させていただきます。
    よろしくお願い致します。

  • @lyhoang3860
    @lyhoang3860 3 роки тому +8

    study japanese and IT together ^^ , thank you sensei

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

    使用する教材はどのようにしてダウンロードできるのですか?

  • @いけしん-z2i
    @いけしん-z2i 4 роки тому

    私でも理解できますっ!ありがとうございます!

  • @てつぺい-n6o
    @てつぺい-n6o 3 роки тому

    しまぶーさんありがとうございます。

  • @zawazawa4713
    @zawazawa4713 4 роки тому

    プログラミング初心者です。
    参考にさせてもらっています。
    便利・よく使用するショートカットキーがありましたら、
    動画等や、参考にできるもの(サイト)があれば、教えていただきたいです。
    また、入力スピードが初心者なのでとても遅いのですが、
    入力スピードは、慣れなのでしょうか?
    あるいわ、
    入力スピードが早くなる方法があれば是非教えていただきたいです。
    どうかよろしくお願いします。

  • @ラブスヌーピー-s9c
    @ラブスヌーピー-s9c 2 роки тому

    この動画を見てプログラマーを目指せます。36歳のプログラマーは遅いですか?

  • @よっちゃんよっP
    @よっちゃんよっP 3 роки тому

    プロジェクト見つかりません。ファイルから開けますか?びっくりマークいれても出できませんでした

  • @ユウキ-w9u
    @ユウキ-w9u 4 роки тому +3

    最近、wixというホームページ制作サイトを知ったのですがその機能を見たらHTMLとCSSを使わなくてもいいと書いてあったのですが、それを見てCSSとHTMIを学ぶ意欲少し失せたんですけど、どういったときに使えますか?HTMIとCSSの学ぶ意味がわからなくってきました泣

    • @shimabu_it
      @shimabu_it  4 роки тому +6

      自分の作りたいものがホームページ作成レベルでよろしければwixでもいいかもしれませんが、エンジニアを目指す上ではhtml, cssは必要な知識になります。
      wixを使ったらどんなデザインでもできるというわけではなく、細かいことをしようとすると難しかったり、また実際のサービス運用という点では向いていません。wix系のツールが得意なのはホームページ作成レベルで、基本的にサービス開発では使えません。例えばYahoo、食べログ、ホットペッパーなども、htmlとcssの知識が必ず使われています。

    • @ユウキ-w9u
      @ユウキ-w9u 4 роки тому +2

      ありがとうございます!!

  • @naoto1681
    @naoto1681 3 роки тому

    HTMLで画像を挿入して、その画像の上(右上端)に文字を乗せたいのですが、なかなかうまくいかず、どうしてもブラウザ画面上(margin上)の右上端になってしまいます。どうしたら良いでしょうか。良い解決方法はありませんか?

  • @user-tb9ks6pz9c
    @user-tb9ks6pz9c 4 роки тому +1

    この人多分めちゃくちゃ頭いい気がする

    • @shimabu_it
      @shimabu_it  4 роки тому +1

      なんかコメント笑いましたw
      ありがとうございます😂

  • @hanahana6831
    @hanahana6831 4 роки тому +3

    在宅で5万円稼げるようになりたくて、プログラミングを勉強し始めた3人の子育てママです。色々と参考にさせて下さい(^^)

    • @shimabu_it
      @shimabu_it  4 роки тому +2

      良い目標ですね!まずは勉強してスキルアップかと思いますが、私の講座が少しでもお力になれれば嬉しいです😊
      一緒に頑張っていきましょ〜!

    • @hanahana6831
      @hanahana6831 4 роки тому +2

      ありがとうございます。
      よろしくお願いします(^^)

  • @三井と女子式温熱療法プ
    @三井と女子式温熱療法プ 3 роки тому +1

    カラーと文字の大きさが反映されない原因は何がありますか?

  • @濱田幸一-i6g
    @濱田幸一-i6g 4 роки тому

    font-sizeがでてきません。
    なぜでしょう?
    そこから進むことができません。
    教えてほしいです。

  • @そーり-u1p
    @そーり-u1p 4 роки тому

    いつもわかりやすい動画ありがとうございます
    atomでcssを書くときタグの補完がされないのですが要因がわかりません、違うテキストエディタの話で申し訳ないのですが、教えてもらえないでしょうか

  • @よっちゃんよっP
    @よっちゃんよっP 3 роки тому

    Chromeとの同期はどのようにしたら良いですか?

  • @TK-go3zo
    @TK-go3zo 4 роки тому

    外部スタイルシートをやる時に、右クリックすると非表示、空いているエディタ、空いているフォルダがありません、アウトライン、タイムラインの5つしかでてきません!どうすれば宜しいですか?

  • @nekohaha6036
    @nekohaha6036 4 роки тому +2

    初心者です。文字のカラーの色が設定されず反映されないのはなぜなのか教えてほしいです。

    • @shimabu_it
      @shimabu_it  4 роки тому

      おそらく拡張子がうまく設定できていないかもです。
      まずは後ろが .css になっていることを確認してみてください!🙏

  • @梅津まき
    @梅津まき 4 роки тому +1

    実践的でやる気が出ます。command + /はWindowsでは何ですか。無効にできません。

    • @shimabu_it
      @shimabu_it  4 роки тому +1

      こちら非常にうまくまとめられているショートカット対応表になります。
      qiita.com/oruponu/items/ae9c720d4522c1606daf
      該当のキーですと「Ctrl+/」ですね!😊

    • @梅津まき
      @梅津まき 4 роки тому

      ありがとうございます。

  • @guisetech1971
    @guisetech1971 4 роки тому +1

    Good job

  • @artfc547
    @artfc547 4 роки тому +1

    いつもわかりやすい動画ありがとうございます。
    ひとつわからないところがあるのですが、外部スタイルシートの時にindex.htmlの左側で右クリックしてもNew Fileと出てきません。

    • @shimabu_it
      @shimabu_it  4 роки тому

      こちらこそ質問ありがとうございます!2点下記を確認してみてください!
      ・index.htmlにカーソルを当てず余白のところで右クリックする
      ・1番左側に5つアイコンがあると思いますが1番上になっているか確認
      こちらで解決しなかった場合は、もう少し具体的に状況を教えていただけると解決できるかもしれません😊✨

    • @artfc547
      @artfc547 4 роки тому +1

      しまぶーのIT大学 すごくわかりやすい説明で解決しました^_^ ありがとうございます!! あといじっていたら一番左の5つあるアイコン、上から1つ、2つと消えてしまって残りの3つしかアイコンが表示されない場合、再表示はできますか?
      何度も質問すいません、、

    • @shimabu_it
      @shimabu_it  4 роки тому

      ​@@artfc547 解決されたようで良かったです!😊
      左のバーの部分で右クリックをすると、チェックマークが入っているものと入っていないものがあると思いますが、チェックマークがあるものが現在表示されているアイコンになります。なので、クリックをしてチェックマークを入れると、アイコンがまた表示されるかと思います!
      また最初はVS Codeを日本語化した方が使いやすいと思うので、拡張機能を入れて日本語化してみてください!
      twitter.com/shimabu_it/status/1239881589703634945

  • @s.k2603ks
    @s.k2603ks 3 роки тому

    初めまして!参考にさせていただいています!emmet の機能が全く機能しないのですが対処法を知りたいです!使っているパッケージは emmet です。検索もしてみましたが出てこないので、質問させていただきます。よろしくお願いいたします

  • @この実がなるよ
    @この実がなるよ 4 роки тому

    文字の間隔とか決まりあるんですか?

  • @名無-f2q
    @名無-f2q 2 роки тому

    スタートした瞬間からもうわからない

  • @むみ-n1w
    @むみ-n1w 4 роки тому

    パソコンすら持ってないのに勉強してるって変ですよね、、、笑
    経済的に厳しくて💦
    でも、こういう勉強をしていくとどんどん覚えたいと思うので、無理やりでも買おうか迷います😂😂
    経験なしで会社に入るのは厳しいですよね😭

    • @むみ-n1w
      @むみ-n1w 3 роки тому

      こんなコメントしてたのも11ヶ月前!!
      成長したちょっとだけ!笑

    • @いちごおれ-v8o
      @いちごおれ-v8o Рік тому

      かわいい

    • @むみ-n1w
      @むみ-n1w Рік тому

      @@いちごおれ-v8o この通知でコメント書いてたの思い出しました(笑)こんなこと書いてたの懐かしい!!今はエンジニアとして働いてます✨✨ 頑張ってよかったです🍓

    • @いちごおれ-v8o
      @いちごおれ-v8o Рік тому +1

      @@むみ-n1w
      ええ!すごい!就職おめでとです👏🏻
      自分もいま就活生でプログラミングスキル0からエンジニア目指してます…!

    • @むみ-n1w
      @むみ-n1w Рік тому

      @@いちごおれ-v8o おおお!!就活しながら勉強とは!!えらいです✨ 私の就職先めちゃくちゃ自由なので本当にストレスフリーです!!転職してよかったと心から思ってます😹 まだまだ勉強の日々ですので、お互い頑張っていきましょうね!!

  • @なおなお-l1h
    @なおなお-l1h 4 роки тому +1

    style.cssが読み込まれません😭保存して、index.htmlから読み込んですのですが…

    • @shimabu_it
      @shimabu_it  4 роки тому +2

      ご質問ありがとうございます!下記該当していないかご確認ください!
      ・タイピングミス
      ・読み込むタグは下記と同じですか?
      ・cssへのパスはあっていますか?
      href="style.css" の部分でstyle.cssのファイルの場所があっているかご確認ください。
      ・style.css内で間違いはありませんか?
      例えば、宣言ブロック({})を閉じ忘れていたり、宣言の最後のセミコロン(;)を入れ忘れていたりしませんか?
      これらに該当しなければコードをいただけると幸いです🙇‍♂️

    • @なおなお-l1h
      @なおなお-l1h 4 роки тому +1

      しまぶーのIT大学index内のhref style.cssを打ってませんでした😅そりゃ読み込まれないですよね…。詳しくありがとうございました!

    • @shimabu_it
      @shimabu_it  4 роки тому

      @@なおなお-l1h あらら😅笑
      解決できたようで何よりです。私も凡ミスを何回もしてきましたし最初はそういうミスはあるあるです。くじけず前に進みましょう!💪

  • @卵殻かけご飯
    @卵殻かけご飯 4 роки тому +2

    すみません。htmlのファイルをクロームで動かしてみたのですが、なぜか表示されません
    同じ書き方、同じソースコードで書きました
    考えられる原因をいくつか挙げてください

    • @shimabu_it
      @shimabu_it  4 роки тому +1

      おっと・・・今も詰まり中でしょうか?原因として考えられることは、うまくパス(自分のindex.htmlへのリンク)が間違っていることでしょうか。
      Chromeに直接index.htmlをドラッグ・アンド・ドロップで反映させることもできるので、ぜひ試してみてください。それでも未解決のようでしたらまた教えて下さい!

  • @adhd3147
    @adhd3147 4 роки тому

    このアプリなんだ?

  • @この実がなるよ
    @この実がなるよ 4 роки тому +1

    早すぎてわからん

  • @この実がなるよ
    @この実がなるよ 4 роки тому +2

    早すぎるしゃべりと動きが

    • @二瓶佑真
      @二瓶佑真 2 роки тому

      おそくすればええやん

  • @norvisblasmoreta5576
    @norvisblasmoreta5576 3 роки тому

    Habla español

  • @トマト先輩-h7f
    @トマト先輩-h7f 3 роки тому

    もう少しゆっくり話せませんか?

  • @北斗拳四郎-m5m
    @北斗拳四郎-m5m 4 роки тому +1

    非常に分かりやすくて助かります

    • @shimabu_it
      @shimabu_it  4 роки тому +1

      ありがとうございます!😂