Front-end system - CSS

1. The box model

标准：border+margin+padding+content

IE : margin+ content(border+padding+content)

2.box-sizing property?

Analytical element for controlling the mode of box model:

box-sizing: W3C standard box model to parse.

border-box: IE traditional box model. After setting up the elements of the aspect, it comprises a border + padding + height / width

3. Selector

1 2 3 4 5 6 7 8 9

id selector (#myid) class selector (.myclassname) tag selector (div, h1, p) adjacent selector (h1 + p) child selector (ul> li) descendant selector (li a) wildcard choice an (*) attribute selector (a [rel = "external" ]) pseudo class selector (a: hover, li: nth -child)

Priority (proximity principle) :! Important> [ID> class> Tag]
! Important higher priority than the inline

4. inheritable properties

Inheritable properties: font-size, font-family, color

Not inherited style: border, padding, margin, width, height

5.CSS3 new pseudo-classes

p: first-of-type parent element belonging to select the first element
p: last-of-type parent element belonging to select the last element
p: only-of-type parent element belonging to select only element
p: only- child element belonging to select only child of its parent element
p: nth-child (2) selecting a second child element of the parent element belonging to
: form control disabled disabled state: enabled.
: checked radio button or check box is selected.

Face questions Links

• CSS base face 50 questions (with answers)
• "50 CSS fundamentals questions (with answers)," the answer is really just the answer?
• CSS face questions summary
• front-end-interview-handbook

Original: Large column  front-end system - CSS