강의

멘토링

로드맵

Inflearn brand logo image
Programming

/

Web Development

コーディングは初めてですが with Web Publishing - CSS

CSSの基礎からアニメーション、レスポンシブまで学習します。 実践的な例を通して学習した内容を復習しながら、確実に基礎を固めます。

  • ezweb
css
웹개발
웹퍼블리싱
퍼블리싱
HTML/CSS
Thumbnail

学習した受講者のレビュー

こんなことが学べます

  • CSS セレクター

  • CSSフォントスタイル

  • CSS レイアウト - float, position

  • CSS レイアウト - flexbox

  • CSSアニメーション、レスポンシブ

HTML次はCSS!
CSSで際立つWebページを作成してください⭐

코딩은 처음이라 with 웹퍼블리싱

Web文書の完成度を高めるCSS🎨

CSSはWeb文書の外観を担当します。 HTML要素でターゲットを選択し、選択したターゲットの色、背景、位置、アニメーションなどを設定することで、見やすく使いやすいウェブ文書を作成できます。

今回の講義は、<コーディングは初めてなのでwithパブリッシング-HTML基礎>に続く講義で、HTML学習になったという前提でWebページスタイルの設定に必要な必須テクニックを学習します。

CSSはHTML要素からスタイルターゲットを正確に選択することを優先します。今回の講義ではCSSセレクタを確実に学習できます。レスポンシブベースを確実に習得し、さまざまな幅の機器で最適化され表現されたWebページを実装します。 transitionとanimation、transform属性を活用してアニメーションを実装する方法を学びましょう。

講義を聞いた後は、CSSセレクタを使用して希望の要素を正確に選択し、選択した要素のスタイルを自由に設定できるようになります。

✔️本作者の直講講義に会いましょう!

  • 本講義はヨンジンドットコムの書籍<コーディングは初めてなので with web パブリッシング>の著者が図書内容に基づいて講義を進行します。本と一緒に見れば、学習にもっと役立つでしょう。
  • 「コーディングは初めてなので with Web パブリッシング - HTML 基礎」講義を受講した後、本講義を引き続き学習してください。
  • 補足学習が必要な場合は、著者のYouTubeチャンネルで追加のレッスンに参加してください。

こんな方にオススメです🙋‍♀️

HTMLの基礎はありますが、
CSS基礎が足りない方

レスポンシブ、アニメーション実装
難しい方

Flexを活用した柔軟な
レイアウトを学びたい方


講義の特徴✨

CSSスタイルの設定に必要なプロパティ
一つ一つ学習します!

長年の講義のキャリアに基づいて
わかりやすく説明しましょう!

シンプルな例として
基本をしっかり固めます!

Flexbox経由
効率的なレイアウトを学ぶ!


こんなことを学びます📚

1)CSSセレクタを確実に学習します。 CSSの開始は、ターゲットを正確に選択することから始まります。


2)フォント関連のスタイルを学習します。


3) レイアウトに関する必須属性を学習する。


4) 背景関連のすべての属性を学習します。


5) フレキシブルレイアウトの中核フレックスを学習し、より多様なレイアウトを簡単に実装します。


6)アニメーションの基礎を学びます。


7) 反応型の基礎を確実に学習し実習します。

デスクトップ画面

タブレット画面

モバイル画面


8) 前講義で作成したHTML Webページを、CSSを活用して実装します。


Q&A 💬

Q. 非専攻者も聞ける講義ですか?

HTML講義を受講したり、基礎があれば可能です。

Q. 授業内容をどのレベルまで扱いますか?

セレクタからレスポンシブまで膨大な量をカバーします。過欲は禁物です。前半からじっくり学習すれば受講完了いただけます。

Q. 頑強な次はどんな学習をすればいいでしょうか?

さまざまなデザインを参照して、HTMLとCSSを活用してWebページの制作を練習してください。その後、Javascriptの学習をお勧めします。


知識共有者の紹介✒️

こんにちは。 rock's easyweb YouTubeチャンネルオペレーターキム・ドンジュ講師です。

メインブック

  • Webデザイン&Webパブリッシングのためのピグマ完全活用書 - 非ジェイパブリック出版社

  • コーディングは初めてだとWebパブリッシング

Contact Me

オフライン講義情報、追加映像などを確認できます。

コミュニケーション窓口(アンケート、1:1オープンチャットルーム) ✒️

受講生の方は、ニュース欄の紹介されているGoogleアンケートと1:1オープンチャットルームを通じて、いつでもコメントや質問をすることができます。

こんな方に
おすすめです

学習対象は
誰でしょう?

  • HTMLを学習された方

  • レスポンシブ対応が難しい方

  • アニメーションの基礎が不足している方

前提知識、
必要でしょうか?

  • HTML

  • フォトショップ

こんにちは
です。

2,522

受講生

49

受講レビュー

3

回答

4.9

講座評価

8

講座

■ [현재] 그린컴퓨터아트학원 웹퍼블리싱, 프론트엔드 강의
■ [현재] 웹 퍼블리싱 유튜브 채널 'Rock's Easyweb' 운영
■ 더조은 컴퓨터아카데미 웹 퍼블리싱 강사
■ 한빛 컴퓨터아카데미 웹 퍼블리싱 강사
■ 프론트엔드 퍼블리셔, 프론트엔드 퍼블리싱 전문강사
■ UI/UX 웹 디자인 포트폴리오 강의


[ 도서 ]
2021.07.19 출간 / 웹디자인 & 웹퍼블리싱을 위한 피그마 완벽 활용서 / 비제이퍼블릭

2022.08.25 출간  / 코딩을 처음이라 with 웹 퍼블리싱  / 영진출판사

2023.10 출간 /2024 SD에듀 유선배 웹디자인기능사 실기 과외노트 / 시대고시기획

2024.11 재판 /2025 SD에듀 유선배 웹디자인기능사 실기 과외노트 / 시대고시기획

 

[ 수상경력 ]
2022.08 그린컴퓨터 아트 학원 종로지점 - 우수강사 2021.06 그린컴퓨터 아트 학원 종로지점 - 우수강사 2018.06 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2017.05 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2016.05 그린 컴퓨터아카데미 신촌 지점 - 우수강사 2015.10 그린 컴퓨터아카데미 신촌 지점 - 우수강사 

 

 

 

カリキュラム

全体

33件 ∙ (9時間 12分)

講座資料(こうぎしりょう):

授業資料
講座掲載日: 
最終更新日: 

受講レビュー

全体

19件

5.0

19件の受講レビュー

  • wlghsp3420님의 프로필 이미지
    wlghsp3420

    受講レビュー 215

    平均評価 5.0

    5

    6% 受講後に作成

    良い講義ありがとうございます。

    • hesshes2407님의 프로필 이미지
      hesshes2407

      受講レビュー 2

      平均評価 5.0

      5

      39% 受講後に作成

      入門者に簡潔で簡単に説明

      • ezweb
        知識共有者

        Figma デザイン参照コーディング講座が新しくオープンしました。この講座もぜひご覧ください ^^ https://inf.run/CZ1az

    • hahahayeji님의 프로필 이미지
      hahahayeji

      受講レビュー 1

      平均評価 5.0

      5

      100% 受講後に作成

      • tomomo님의 프로필 이미지
        tomomo

        受講レビュー 7

        平均評価 5.0

        5

        100% 受講後に作成

        良い講義をありがとうございました。_(__)_

        • ezweb
          知識共有者

          私もありがとうございます。他の講座も挑戦してみてくださいね ^^

      • prayforyooh2177님의 프로필 이미지
        prayforyooh2177

        受講レビュー 4

        平均評価 4.8

        5

        30% 受講後に作成

        無料

        ezwebの他の講座

        知識共有者の他の講座を見てみましょう!

        似ている講座

        同じ分野の他の講座を見てみましょう!