学習内容

CSSをHTMLにリンクしてシームレスなスタイリングを実現します。

カスタムフォントとプロパティによるテキストのスタイリング。

レスポンシブレイアウトのためのFlexboxの習得。

HTML要素に対するCSSセレクタの習得。

CSSボックスモデルの理解と適用。

装飾効果の追加。

ユーザーアクション擬似クラスの効果的な適用。

要素間のスペース調整のためのマージンとパディングの使用。

コース内容

ウェブページの外観と雰囲気を変えるスタイリング言語であるCSSの基本を習得します。テキストスタイル、色、間隔、ボックスモデル、Flexbox、装飾効果などのコアコンセプトを探求します。視覚的に魅力的で構造化されたウェブページを作成するスキルを身につけます。

背景色、画像、疑似要素、シャドウを使用してレイアウトを強化します。視覚コンポーネントに奥行きとコントラストを持たせたスタイル設定。

チャレンジ：最初のウェブページにスタイルを適用する

displayプロパティ：Block、Inline、Inline-block

チャレンジ：Flexboxを使用したショップカードレイアウトの作成

チャレンジ：Flexboxで縦型ブログカードを作成する

Understanding Grid Containers and Items

Defining Rows and Columns

Grid Gaps and Alignment

Building a Real-World Layout

チャレンジ：モダンなカードコンポーネントを作成する

あなたのテックスキルを強化！

最大55％オフで

What you'll get with our subscription:

500+ 人気コース修了証明書パーソナライズされた学習トラック40+ 実践的なプロジェクト

あなたのサブスクリプションには500以上のコースが含まれています：

究極のHTML

HTMLの基本を学びましょう。HTMLはすべてのウェブサイトの基盤です。タグや属性を使ってコンテンツを構造化し、明確なドキュメントレイアウトを構築し、画像、リンク、テーブルを追加します。入力やインタラクションを取得するためのアクセシブルでユーザーフレンドリーなフォームを作成します。ベストプラクティスに従いながら、構造化され機能的なウェブページの作成を実践します。HTMLを習得してウェブ開発の第一歩を踏み出しましょう。

CSSの基礎

ウェブページの外観と雰囲気を変えるスタイリング言語であるCSSの基本を習得します。テキストスタイル、色、間隔、ボックスモデル、Flexbox、装飾効果などのコアコンセプトを探求します。視覚的に魅力的で構造化されたウェブページを作成するスキルを身につけます。

HTMLの基本

HTMLの基本を習得し、構造化され、アクセシブルなウェブコンテンツを作成します。タグ、要素、属性を使用してドキュメントを構造化する方法を学びます。テキスト、リスト、画像、音声、動画を自在に扱い、ウェブページを充実させます。整理されたデータのためのテーブルや、ユーザー入力・インタラクションのためのフォームを作成します。アクセシビリティを高めるセマンティックHTMLを理解し、基礎から完全で機能的なウェブサイト構造を構築します。

CSS Layout, Effects, and Sass

Level up your styling skills by mastering advanced CSS techniques for modern web design. Position and manage elements with precision using advanced positioning strategies. Create smooth transitions and engaging animations to enhance user experience. Transform and manipulate elements for dynamic visual effects. Build responsive designs that adapt across devices and learn to streamline your workflow with CSS preprocessors like Sass.

HTML Essentials

Build structured web pages using HTML elements and semantic layout. Work with text, links, images, tables, and forms to create real content. Learn how to organize and structure complete web pages from scratch.

Introduction to Web and Frontend Development

Understand how the web works and how websites are built. Explore the Internet, how pages are delivered, and the difference between frontend and backend development.

Introduction to Fullstack Web Development

Understand how the web works and how frontend, backend, and databases connect to form a complete application. Explore the role of fullstack development and the technologies used across the track, including HTML, CSS, JavaScript, React, Node.js, Express.js, and MongoDB. Build a clear mental model of how data flows through an application before starting hands-on development.

究極のHTML

HTMLの基本を学びましょう。HTMLはすべてのウェブサイトの基盤です。タグや属性を使ってコンテンツを構造化し、明確なドキュメントレイアウトを構築し、画像、リンク、テーブルを追加します。入力やインタラクションを取得するためのアクセシブルでユーザーフレンドリーなフォームを作成します。ベストプラクティスに従いながら、構造化され機能的なウェブページの作成を実践します。HTMLを習得してウェブ開発の第一歩を踏み出しましょう。

CSSの基礎

ウェブページの外観と雰囲気を変えるスタイリング言語であるCSSの基本を習得します。テキストスタイル、色、間隔、ボックスモデル、Flexbox、装飾効果などのコアコンセプトを探求します。視覚的に魅力的で構造化されたウェブページを作成するスキルを身につけます。

HTMLの基本

HTMLの基本を習得し、構造化され、アクセシブルなウェブコンテンツを作成します。タグ、要素、属性を使用してドキュメントを構造化する方法を学びます。テキスト、リスト、画像、音声、動画を自在に扱い、ウェブページを充実させます。整理されたデータのためのテーブルや、ユーザー入力・インタラクションのためのフォームを作成します。アクセシビリティを高めるセマンティックHTMLを理解し、基礎から完全で機能的なウェブサイト構造を構築します。

CSS Layout, Effects, and Sass

Level up your styling skills by mastering advanced CSS techniques for modern web design. Position and manage elements with precision using advanced positioning strategies. Create smooth transitions and engaging animations to enhance user experience. Transform and manipulate elements for dynamic visual effects. Build responsive designs that adapt across devices and learn to streamline your workflow with CSS preprocessors like Sass.

HTML Essentials

Build structured web pages using HTML elements and semantic layout. Work with text, links, images, tables, and forms to create real content. Learn how to organize and structure complete web pages from scratch.

Introduction to Web and Frontend Development

Understand how the web works and how websites are built. Explore the Internet, how pages are delivered, and the difference between frontend and backend development.

Introduction to Fullstack Web Development

Understand how the web works and how frontend, backend, and databases connect to form a complete application. Explore the role of fullstack development and the technologies used across the track, including HTML, CSS, JavaScript, React, Node.js, Express.js, and MongoDB. Build a clear mental model of how data flows through an application before starting hands-on development.

なぜ人々はCodefinityを選ぶのか

Web Developer

Kwizera Mugisha

The teaching methodology at Codefinity is excellent, and I particularly appreciate how it has prepared me to handle real-world coding problems. Currently, I am delving into Node.js and eagerly anticipate building full-stack projects that integrate all the knowledge I have gained.

Senior Business Analyst

Sherry Barnes-Fox

My first course was 4 hours, I did it in a few days, "nugget-style". The instructions are very clear and easy to understand. There is even a hint to help you get the answer. I love the learning style that is used, it engages me.

Accounts Payable Specialist

Bill Wagner

I have really liked the browser-based lessons that allow me to code within the lesson. The RUN button allows me to test the code I write before submitting for a grade.

IT Support Specialist

Daniel Chinea

I have gained a lot of practical and logical thinking skills, along with patience for myself and confidence in myself that I can learn programming. Years ago, I would have never thought that I could learn programming in any way, shape or form, and I was able to obtain these certifications and skills with Codefinity.

Technology Project Manager

Steve Bruening

The learning was progressive and made it easy to follow along and make progress. I could feel my skills increasing and building on each other as the course went along.

Project Manager

Stephanie Chan

As I went through the first course of the Python track, I liked the way the course was lay out (in easy and digestible modules) with little exercises at the end of each concept.