Containers and semantic tags in html

Containers and semantic tags in html

** div **: no semantic
header : often used to represent header, may also represent the head of the article
footer : footer usually means may also represent the tail of the article
Article This article was : often used to represent the whole article
Section : usually To represent the chapter
aside of the article : usually used to represent the sidebar

The div block-level elements h1~h6 are also fast-level elements. In layman's terms: no other people are allowed nearby. It can be seen as a rectangle with area: width and height. Border: attribute. Content: You can set the distance from the border. Placement: The distance between the placed parent element.

Elements in the line

The row height cannot be set, and there can be left and right margins and spacing.

Pseudo element selector

1. :first-letter and first-line
2. :before and :after
   ……Fill in later

css attributes

<!- 字体属性：
字体大小：font-size
字体样式：font-style:oblique(偏斜体)italic(斜体)normal正常

 -->
 <!- 
 圆角边框和图像边框
 圆角边框
 	css中使用border-radius属性可以设计各种类型的圆角边框
 	css中使用border-radius属性赋一组值来定义圆角
 	左上： border-top-left-radius: 10px; 等价于 border-radius: 10px 0 0 0;
	右上： border-top-right-radius: 10px; 等价于 border-radius: 0 10px 0 0;
	左下： border-bottom-left-radius: 10px; 等价于 border-radius: 0 0 0 10px;
	右下： border-bottom-right-radius: 10px; 等价于 border-radius: 0 0 10px 0;
border-radius: 10px 40px 100px; 为 左上 右上左下 右下
border-radius: 10px 40px; 为 左上右下 右上左下
border-radius: 10px; 为 四个圆角值相同

 -->
 <style type="text/css">
 	border-radius: 10px 20px 30px 40px;
 </style>