CSS add styles to web page. Each element have several style properties.

Basic Propeties

font-famiy

h1 {
  font-family: Georgia;
}

• the specific font must be installed
• use Web safe fonts, or the font you choose may not appear the same between all browsers and operating system.
• when the name of a typeface consists of more than one word, enclose the name in quotes, like ‘Courier New’.

font-size

p {
  font-size: 18px;
}

• px means pixels

font-weight

p{
  font-weight: bold;
}

• normal or bold.

text-align

h1 {
  text-align: right;
}

• left, right, center, justify(两端对齐)

color

h1{
  color: red;
  background-color: blue;
}

• color: the color of the element itself.
• backgound-color: the background color of the element.

opacity

.overlay {
  opacity: 0.5;
}

• 1 represent 100%, fully visible.
• 0 represent 0%, fully invisible.

background-image

.main-banner {
  background-image: url('https://www.example.com/image.jpg'); 
}

• set the background of an element to display an image.
• you can use relative path as well.

important

p {
  color: blue !important;
}

• override other any style.