ADDING BACKGROUND

QUARTER 3 WEEK 6

Adding Background Color To A Text

Index

Prayer

Greetings

Objectives

SELS

Intro

Review

Page XX

Page XX

Page XX

Page XX

Page XX

Page XX

Adding Background

Examples

Activity

Quotes

Page XX

Page XX

Page XX

Page XX

PRAYER

GREETINGS

OBJECTIVES

• Analyze the impact of different background color choices on the readability and usability of a webpage, considering factors such as contrast, accessibility, and user experience.
• Appreciate the importance of selecting an appropriate background color for a webpage, taking into account the branding, messaging, and aesthetic goals of the website.
• Create a webpage with a specific background color using CSS, either by selecting a color from a predefined palette or by customizing the color using a color picker tool.

Weather Weather Lang

Directions:Students will describe what they would be like if they were the weather today.

Review:Join Words

Directions: : Match the descriptions in Column A with the name of property in Column B.

Review:Join Words

Link:https://view.genial.ly/64049d3315f500001a3cfbd1/interactive-content-join-words

Introduction

The way text is formatted is crucial to the overall look of a webpage and can greatly impact its success or failure. It also has the potential to capture or lose the interest of viewers. In order to enhance the appearance of a webpage, useful techniques include adding background to text, customizing lists, and incorporating borders.

Adding Background Color to a Text

To add a background color to text in HTML and CSS, you can use the CSS background-color property. Here's an example:

In this example, the p element (paragraph) has been targeted in the CSS, and the background-color property has been set to yellow. You can change the color value to any valid CSS color, such as red, green, blue, or even a hexadecimal color code like #FFA500.

Here's another example:

The CSS background-color attribute enables you to modify the background color of an HTML element. It can be used to change the background color of various elements such as tables, divs, headings, and spans.

Here's another example:

This code sets the background color of the entire table element to light blue.

Here's another example:

This code sets the background color of the entire div element (including the heading and text) to light green.

Here's another example:

This code sets the background color of the h1 heading element to yellow.

You can adjust the color value to any valid color name, hexadecimal value, or RGB value to achieve the desired background color.

Activity:Color of my life

Open a Notepad on your computer or phone and create a code that represents the color of your life at this moment. Additionally, choose or create a background color that goes well with the color you have chosen.

"We are all the colors of life and we live together in harmony to make this world more beautiful and give happiness to everyone.”― Andry lavigne

Thanks!