Quarter 3 Week 5
IDENTIFY AND FORMAT FONT, TEXT PROPERTIES
AND CSS STYLES
New lesson
Start
Introduction
Review
Objectives
Font Property
index
CSS Property
Text Property
Putting it all together
Activity
Review
Directions: : Identify what is being asked from the given items and select your response from the options provided.
+ Quiz Link
OBJECTIVES
- Recognize various font styles, text properties, and CSS styles
- Utilize CSS to modify font formats
- Emphasize the significance of CSS in formatting text for our web pages.
INTRODUCTION
In formatting text using CSS, there are property attributes that we must first understand so we will not be having troubles while we are coding CSS and they are categorize to three, namely:
- Font Property
- Text Property
- CSS Property.
Among these three, the Font Property and CSS Property has most of the attributes are the same, their difference is there are CSS Property that are not present in Font Property.
FONT PROPERTY
The font property in CSS is used to specify the style, size, weight, and family of a font to be applied to an HTML element. It can be used to customize the typography of a webpage and make it more visually appealing and readable. The font property can also be used to set different font properties for different parts of a webpage, such as headings, paragraphs, and lists.
FONT PROPERTY
FONT PROPERTY
Text PROPERTY
The text property in CSS is used to modify the appearance of text on a webpage. It includes a variety of sub-properties that can be used to change the color, alignment, decoration, spacing, and more of text. Some of the commonly used sub-properties of the text property include color, text-align, text-decoration, text-transform, line-height, letter-spacing, and word-spacing. By using these properties, developers can customize the text on their webpage to make it more readable, accessible, and visually appealing.
Text PROPERTY
Text PROPERTY
Text PROPERTY
Text PROPERTY
Text PROPERTY
CSS PROPERTY
CSS PROPERTY
CSS PROPERTY
CSS PROPERTY
Changing the font, size, case, alignment, indent spacing and color
To format text in CSS, we first create our HTML Page to see the structure and how we will want our content appear when it will be viewed using the browser. Using the property attributes provided in the lesson 1 of this module, we will now apply it to the sample content for this activity. Take a look from this example below:
Changing the font, size, case, alignment, indent spacing and color
Changing the font, size, case, alignment, indent spacing and color
ACTIVITY:Voice your belief
Direction:Create a webpage that expresses your opinion on the recent news about the jeepney phase out and apply formatting using the text and font properties you have learned today. Note: Don't hesitate to try out various font families, sizes, weights, colors, and other properties to observe how they impact the text's appearance on your web page. Additionally, you can experiment with making new classes and applying them to different elements to observe how they affect the text's appearance.
Good job
Lesson Completed
Always remember that you are absolutely unique. Just like everyone else. -Margaret Mead
Home
IDENTIFY AND FORMAT FONT, TEXT PROPERTIES AND CSS STYLES
TRICIA MAY CAGAOAN
Created on March 4, 2023
Start designing with a free template
Discover more than 1500 professional designs like these:
View
Essential Learning Unit
View
Akihabara Learning Unit
View
Genial learning unit
View
History Learning Unit
View
Primary Unit Plan
View
Vibrant Learning Unit
View
Art learning unit
Explore all templates
Transcript
Quarter 3 Week 5
IDENTIFY AND FORMAT FONT, TEXT PROPERTIES AND CSS STYLES
New lesson
Start
Introduction
Review
Objectives
Font Property
index
CSS Property
Text Property
Putting it all together
Activity
Review
Directions: : Identify what is being asked from the given items and select your response from the options provided.
+ Quiz Link
OBJECTIVES
INTRODUCTION
In formatting text using CSS, there are property attributes that we must first understand so we will not be having troubles while we are coding CSS and they are categorize to three, namely:
Among these three, the Font Property and CSS Property has most of the attributes are the same, their difference is there are CSS Property that are not present in Font Property.
FONT PROPERTY
The font property in CSS is used to specify the style, size, weight, and family of a font to be applied to an HTML element. It can be used to customize the typography of a webpage and make it more visually appealing and readable. The font property can also be used to set different font properties for different parts of a webpage, such as headings, paragraphs, and lists.
FONT PROPERTY
FONT PROPERTY
Text PROPERTY
The text property in CSS is used to modify the appearance of text on a webpage. It includes a variety of sub-properties that can be used to change the color, alignment, decoration, spacing, and more of text. Some of the commonly used sub-properties of the text property include color, text-align, text-decoration, text-transform, line-height, letter-spacing, and word-spacing. By using these properties, developers can customize the text on their webpage to make it more readable, accessible, and visually appealing.
Text PROPERTY
Text PROPERTY
Text PROPERTY
Text PROPERTY
Text PROPERTY
CSS PROPERTY
CSS PROPERTY
CSS PROPERTY
CSS PROPERTY
Changing the font, size, case, alignment, indent spacing and color
To format text in CSS, we first create our HTML Page to see the structure and how we will want our content appear when it will be viewed using the browser. Using the property attributes provided in the lesson 1 of this module, we will now apply it to the sample content for this activity. Take a look from this example below:
Changing the font, size, case, alignment, indent spacing and color
Changing the font, size, case, alignment, indent spacing and color
ACTIVITY:Voice your belief
Direction:Create a webpage that expresses your opinion on the recent news about the jeepney phase out and apply formatting using the text and font properties you have learned today. Note: Don't hesitate to try out various font families, sizes, weights, colors, and other properties to observe how they impact the text's appearance on your web page. Additionally, you can experiment with making new classes and applying them to different elements to observe how they affect the text's appearance.
Good job
Lesson Completed
Always remember that you are absolutely unique. Just like everyone else. -Margaret Mead
Home