inflearn logo
inflearn logo

物語で孊ぶCSS

HTMLで䜜ったカフェホヌムペヌゞをCSSで矎しく装食する実戊プロゞェクト講矩です。 色圩、レむアりト、タむポグラフィからFlexbox、Grid、アニメヌション、レスポンシブデザむンたでCSSのすべおの基瀎をミンゞずコヌド先生のストヌリヌを远いながら自然に孊ぶこずができたす。 4時間の孊習で初心者もプロフェッショナルなWebデザむンを完成させるこずができたす。

5名 が受講䞭です。

難易床 入門

受講期間 無制限

css
css
Responsive Web
Responsive Web
Flex
Flex
css-grids
css-grids
Web Design
Web Design
css
css
Responsive Web
Responsive Web
Flex
Flex
css-grids
css-grids
Web Design
Web Design
날개 달늰 동전

講座 を玹介しお、成長ず収益を埗たしょう

날개 달늰 동전

マヌケティングパヌトナヌズ

講座 を玹介しお、成長ず収益を埗たしょう

受講埌に埗られるこず

  • CSSの党おの基本属性を実戊プロゞェクトを通じお䜓埗するこずができたす

  • 色圩、レむアりト、タむポグラフィなど、デザむンの基瀎を理解するこずができたす

  • HTMLで䜜ったカフェホヌムペヌゞを実際に矎しく食るこずができたす

  • レスポンシブりェブデザむンの基瀎を実習を通じお孊ぶこずができたす

  • 珟代的なWebデザむントレンドを適甚できる実力を身に぀けるこずができたす

ストヌリヌで孊ぶCSS - ミンゞのカフェホヌムペヌゞデザむン

HTMLで䜜ったカフェホヌムペヌゞをCSSで矎しく装食する実戊プロゞェクト講矩です。

色、レむアりト、タむポグラフィからFlexbox、Grid、アニメヌション、レスポンシブデザむンたで

CSSの党おの基瀎をミンゞずコヌド先生のストヌリヌを远いながら自然に孊ぶこずができたす


✹ この講矩の特別な点

🎭 ストヌリヌテリング孊習

民智ずコヌド先生の物語を远いながら自然にCSSを孊びたす。単玔な暗蚘ではなく文脈の䞭で理解する孊習

🏗 実戊プロゞェクト

コヌドブルヌカフェのホヌムペヌゞを最初から最埌たで完成させたす。孊んだ内容をすぐに適甚しながらポヌトフォリオ完成

📱 レスポンシブデザむン

モバむルからデスクトップたで、すべおのデバむスで完璧に衚瀺されるりェブサむトを䜜りたす。実務必須スキル習埗

ストヌリヌだけでなく、理論孊習に関する予想質問ず回答、コヌド先生のお埗な情報もご芧ください

ミニクむズや孊習たずめも䜓系的に敎理されおいたす

🎓 䜕を孊びたすか

Section 1: CSSを始める

  • ✅ CSS接続方法ずセレクタヌ

  • ✅ 色ず背景のスタむリング

  • ✅ フォントずテキストの装食

Section 2: ボックスモデルずレむアりト

  • ✅ ボックスモデルの完党理解

  • ✅ 䜙癜ずサむズ調敎

  • ✅ 芁玠配眮の基瀎

Section 3: モダンレむアりト

  • ✅ Flexboxをマスタヌする

  • ✅ CSS Gridでギャラリヌを䜜る

  • ✅ プロフェッショナルなレむアりト構成

Section 4: むンタラクションずアニメヌション

  • ✅ ホバヌ効果ず状態倉化

  • ✅ CSSアニメヌション

  • ✅ スムヌズなトランゞション効果

Section 5: レスポンシブデザむン

  • ✅ メディアク゚リの掻甚

  • ✅ モバむル最適化

  • ✅ クロスブラりザ察応


🎯 孊習埌の期埅効果

孊ぶこずになるもの

CSSの党おの基本属性を実戊プロゞェクトを通じお䜓埗

色圩、レむアりト、タむポグラフィなどデザむンの基瀎理解

HTMLで䜜ったカフェホヌムペヌゞを実際に矎しく装食する

レスポンシブWebデザむンの基瀎を実習を通じお習埗

珟代的なWebデザむントレンドを適甚できる実力

完成埌にできるこず

🚀 ポヌトフォリオに远加できる完成床の高いプロゞェクト

🚀 様々な業皮のホヌムペヌゞを盎接デザむン

🚀 GitHub Pagesでデプロむしお実際のWebサむト運営

🚀 次のステップJavaScript孊習のための確固たる基瀎

📋 前提知識


こんな方に
おすすめです

孊習察象は
誰でしょう

  • HTMLの基瀎を孊んだが、デザむンは難しく感じおいる初心者

  • コヌドで矎しいりェブサむトを䜜りたい方

  • シンプルなHTMLペヌゞをプロフェッショナルに䜜りたい方

  • りェブデザむンの基瀎を孊びたい方

  • カフェ、レストラン、小芏暡事業のホヌムペヌゞを矎しく食りたい瀟長様

前提知識、
必芁でしょうか

  • HTMLの基瀎知識が必芁ですHTMLタグの基本構造を知っおいる必芁がありたす。「物語で孊ぶHTML」講矩を先に受講するか、最䜎限div、h1、p、a、imgなどの基本タグを知っおいれば十分です。

こんにちは
sarcです。

168

受講生

13

受講レビュヌ

3

回答

4.0

講座評䟡

5

講座

こんにちは。゜ヌシャルアヌカむブです。

゜ヌシャルアヌカむブでは、「長期保存の䟡倀を持぀高品質な資料の保管庫」を運営しおおり、皆様の働き方を革新する3぀の圹割を担っおいたす。

  1. [゜フトりェア゚ンゞニア]カカオ゚ンタヌプラむズでバック゚ンドAPIを開発し、業務システムの根本的な効率化を远求しおきたした。この経隓が、AI自動化プロセスを最も堅牢に蚭蚈する基盀ずなっおいたす。

  2. [AIパむロット] 私はGPTずAIツヌルを掻甚し、実務で最も速く正確な成果を導き出す先行ナヌザヌです。怜蚌枈みのノりハりだけを厳遞し、皆様に最適な飛行ルヌトを提瀺したす。

  3. [専門講垫]KB囜民銀行 ITアカデミヌずGOORM EDUのメむン講垫ずしお、耇雑な技術を実務にすぐ適甚できる分かりやすい知識ぞず解きほぐす䌝達力を備えおいたす。

この講矩は、3぀のペル゜ナの最高の胜力を凝瞮した高品質な業務革新資料です。私ず䞀緒に、AIを単なるツヌルではなく、未来の栞心資産ぞず倉えおいきたしょう。

もっず芋る

カリキュラム

党䜓

15件 ∙ (3時間 51分)

講座資料こうぎしりょう:

授業資料
講座掲茉日: 
最終曎新日: 

受講レビュヌ

ただ十分な評䟡を受けおいない講座です。
みんなの圹に立぀受講レビュヌを曞いおください

sarcの他の講座

知識共有者の他の講座を芋おみたしょう

䌌おいる講座

同じ分野の他の講座を芋おみたしょう

ï¿¥2,447