Зміст курсу

CSS Fundamentals

1. Introduction to CSS

What is CSS?Connecting HTML and CSS Selectors for Styling HTML Elements Challenge: Add Your First Styles Challenge: Add The Styles using the Class Name User Action Pseudo-Classes Challenge: User Action Pseudo-Classes Text Colors Effective Work with CSS Challenge: Variables in CSS

2. Text Styles

Text Styling Text Formatting Challenge: Text Formatting Adding Custom Fonts to the Web Page Font Properties Challenge: Fonts

3. Box Model and Element Spacing

Box Model Box Sizing Adding Space to Elements Challenge: Box-Sizing Structural and Functional Pseudo-Classes Challenge: Structural Pseudo-Classes Element Types Working with Block-Level Elements Working with Inline Elements Challenge: Predict the Page Layout

4. Flexbox

What is the Flexbox? Flex Direction Justifying Content Horizontally Aligning Items Vertically Flex Item Properties Challenge: Flexbox Challenge: Work with Flexbox

5. Decorative Effects

Background Color Background Image Working with Images Decorative Pseudo-Elements Shadows Challenge: Decorative Effects Further Steps

CSS Fundamentals

Text Styling

text-decoration

The text-decoration property can be applied to any text content, including links, headings, paragraphs, and lists. It adds line effects such as underlining. Common values:

Let's run the following example and see the difference between all the property values.

index.html

index.css

index.js

text-transform

The text-transform property allows us to change the capitalization of text content in HTML elements.

Let's consider the difference between all the property values:

index.html

index.css

index.js

text-align

The text-align property allows you to horizontally align text content.

index.html

index.css

index.js

1. What CSS property allows to change the capitalization of text content?

2. What CSS property allows to horizontally align text content?

3. What CSS property allows you to add visual effects to the text content, such as underline or strike-through?

Все було зрозуміло?

Секція 2. Розділ 1

Зміст курсу

CSS Fundamentals

1. Introduction to CSS

2. Text Styles

Text Styling Text Formatting Challenge: Text Formatting Adding Custom Fonts to the Web Page Font Properties Challenge: Fonts

3. Box Model and Element Spacing

4. Flexbox

What is the Flexbox? Flex Direction Justifying Content Horizontally Aligning Items Vertically Flex Item Properties Challenge: Flexbox Challenge: Work with Flexbox

5. Decorative Effects

Background Color Background Image Working with Images Decorative Pseudo-Elements Shadows Challenge: Decorative Effects Further Steps

CSS Fundamentals

Text Styling

text-decoration

The text-decoration property can be applied to any text content, including links, headings, paragraphs, and lists. It adds line effects such as underlining. Common values:

Let's run the following example and see the difference between all the property values.

index.html

index.css

index.js

text-transform

The text-transform property allows us to change the capitalization of text content in HTML elements.

Let's consider the difference between all the property values:

index.html

index.css

index.js

text-align

The text-align property allows you to horizontally align text content.

index.html

index.css

index.js

1. What CSS property allows to change the capitalization of text content?

2. What CSS property allows to horizontally align text content?

3. What CSS property allows you to add visual effects to the text content, such as underline or strike-through?

Все було зрозуміло?

Секція 2. Розділ 1