Selector

Change the color of all p (paragraph) elements to "red".

style
p { color: red; }
style

---

Change the color of the element with id=para1 , to "red".

style
#para1 { color: red; }
style

---

Change the color of all elements with the class "colortext", to "red".

style
.colortext { color: red; }
style

---

Change the color of all p (paragraph) and h1 (header1) elements, to "red". Group the selectors to minimize code.

style
h1, p { color: red; }
style

---

CSSPosition

Add an external style sheet with the URL: "mystyle.css".

link rel="stylesheet" href="mystyle.css"

---

Set "background-color: linen" for the page, using an internal style sheet.

style
body {
background-color:linen;}
style

---

Set "background-color: linen" for the page, using an inline style.

- body style="background-color: linen" -

---

Background

Set the background color for the page to "linen" and the background color for h1 to "lightblue".

style body {
background-color:linen;
}
h1 {
background-color: lightblue;
}
style

---

-------- Set "a.png" as the background image of the page.

style
body {
background-image: url(https://www.industrialempathy.com/img/remote/ZiClJf-640w.avif); }
style

---

Use the shorthand background property to set background image to "img_tree.png", show it once, in the top right corner.

style
body{
background-image: url(moo.png) no-repeat top right ;
}
style

Border

Set a "4px", "dotted" border for "p" .

style body {
border-style: dotted; border-width: 4px;
} style

---

With the border property: Set the border for p to "10px", "solid" and "green".

style body {
p { border: 10px solid green; }
} style

---

Margin

Set all margins for h1 to "25px".

style h1{
background-color: lightblue; margin: 25px;
} style

---

Use the margin property to set the top and bottom margins for h1 to "50px", and left and right margins to "25px".

style
h1 {
background-color: lightblue; margin: 50px 25px; }
} style

---

Use the margin property to center align the h1 element.

style
h1 {
background-color: lightblue; width: 300px; margin: auto; }
} style

---

Padding

Set the top padding of p to "30px".

style p{
background-color: lightblue; padding-top: 30px;
} style

---

Set all paddings for p to "50px".

style
p {
background-color: lightblue; padding: 50px; }
} style

---

Use the padding property to set the top and bottom paddings for p to "25px", and left and right paddings to "50px".

style
p {
background-color: lightblue; padding: 25px 50px; }
} style

---