css basics

css basics

What is CSS?

CSS (Cascading Style Sheet) Cascading Style Sheet, referred to as style sheet.

Role: Web page layout, beautify the web page.

The way to introduce CSS:


1. Inline style (quoted directly in the label, generally not used)

2. Internal style (write/style in the middle of style, generally used in learning)

3. External style (import out.css, used in actual development)


Selector: Used to select labels for setting and beautification

Selector type:

ID selector, Class selector, label selector, descendant selector (space), wildcard selector, group selector (with comma), pseudo-class selector (a tag)


CSS layout:

1. Font settings

color: color setting

font-size: font size

font-family: font style

font-style: Whether to tilt (normal: normal tilt: italic)

font-weight: Whether to bold (normal: normal bold: bold)

font (composite attributes): font-style (can be omitted) font-weight (can be omitted) font-size font-family


2. Text settings

text-decoration: underline, overline, line-through, none (default)

text-indent (indent): 2 em (one character unit)

text-align (alignment): left, right, center

line-height


Both font and text settings are inherited

3. Box model

width: wide

height: high

border: border

eg: border: 3px (border width) solid (border type) red (color)

padding: inner margin (distance between text and border)

padding: 2px 3px 4px (upper 2 left and right 3 lower 4)

Margin: outer margin (the distance between the border line and the box model)

background: background color


Note: weight and height do not work for female tags