Novice novice's notes on learning css

1. Review

1. What is CSS?
   Cascading Style Sheets - Cascading styles will only be overridden but not replaced

2. How to use CSS
   style attribute--->

   
   sytle Tag---> Inside the head tag
   link--->

3. Basic selector
   html tag selector passed html tag name to select elements
     ① All html tags can be used as selectors
     ② No matter how deep the tag is hidden, it will be selected
     ③ All tags are selected instead of a specific tag. So what we set through the html tag selector are some common issues
   id selector
   ① Any tag can use the id attribute and attribute value (because id is a global attribute). The ID name cannot be named arbitrarily. It is case-sensitive. The name of the ID can have numbers, letters and underscores, but it must start with a letter.法 法
   
   
   
   
   
   

   TestHeader Little Hump TestHeader Big Humps ② But the ID name cannot be repeated
Class selectioner ① Any label can use the class attribute (Class attribute is also a global attribute) ②Class attributes Names can be reused

③A class attribute can have multiple class attribute values.

---

1. 2. Comprehensive selector

2. Descendant selector div p

3. Intersection selector div.dl

4. Union selector div, p

5. Child element selector div> p

6. sequence selector ul li:first-child ul:li:last-child

7. adjacent sibling selector div + p

ordinary sibling selector div ~ p

---

1. three , Inheritance

2. Inheritance: Certain css attributes of the parent element will be unconditionally inherited by the child element. All css attributes about text can be inherited: color text- line-font-

   
   
   
   Stacking

   Stacking solves the problem of CSS conflicts
Compare weights to solve the cascading problem

! important can change the weight of "individual attributes" to infinite. Use as little as possible.

---

4. Block-level elements and inline elements

div block-level elements 🎜span inline elements 🎜The difference between block-level elements and inline elements: 1. The width and height cannot be set for inline elements. The width and height of the inline element are the same as the width and height of the label. Block-level elements can set width and height 2. Block-level elements will occupy a separate line. However, inline elements cannot occupy a line by themselves and can only share a line with other inline elements. 3. If the block-level element does not set a width, the block-level element will automatically occupy the entire width of the parent element. 🎜

The above is the detailed content of Novice novice's notes on learning css. For more information, please follow other related articles on the PHP Chinese website!