CSS基础语法之盒子模型

目录

一、 选择器

1.1 结构伪类选择器

1.1.1基本使用

1.1.2 :nth-child(公式)

1.2 伪元素选择器

二、 PxCook

三、盒子模型

3.1 盒子模型-组成

3.2 边框线

3.2.1四个方向

3.2.2 单方向边框线

3.3 内边距

3.4 尺寸计算

3.5 外边距+版心居中

3.6 清除默认样式

3.7 元素溢出

3.8 外边距问题

3.8.1合并现象

3.8.2 外边距塌陷

3.9 行内元素 – 内外边距问题

3.10 圆角

正圆形状:给正方形盒子设置圆角属性值为 宽高的一半 / 50%

 胶囊形状:给长方形盒子设置圆角属性值为 盒子高度的一半​

盒子阴影(拓展)

四、综合案例

4.1产品卡片

 4.2新闻列表


一、 选择器

1.1 结构伪类选择器

1.1.1基本使用

作用:根据元素的结构关系查找元素。CSS基础语法之盒子模型_第1张图片

你可能感兴趣的:(HTML,css,前端,javascript)