CSS经典易错点剖析

width/height

width: 82vw;

height: 80vh;

width: 100%;

width: auto

• vw：视窗宽度的百分比（1vw 代表视窗的宽度为 1%）
• vh：视窗高度的百分比

• 在许多情况下，我们希望元素占据其父元素的整个宽度，以实现响应式设计。这时就可以使用 width: 100%。

•  的设置更注重元素内容的大小。当你希望元素的宽度根据其内部内容的多少自动调整时，这是一个理想的选择。

box-shadow

over-flow:

display:

display:flex;按行排列在一起

align-items

align-items

ertical-align: middle

假设你有一个文本行和一个图像，并且你希望图像与文本垂直居中：

<p>这是一些文本 <img src="example.jpg" alt="示例图片" style="vertical-align: middle;"> 和更多文本。</p>

border-collapse: collapse;

border-collapse 是一个 CSS 属性，主要用于 <table> 元素，它决定了表格中相邻单元格边框的合并方式。这个属性有两个主要的值：separate 和 collapse。

• separate（默认值）：这是边框的默认合并方式。在这种情况下，相邻单元格的边框是独立的，并且它们之间可能会有空白或间距（取决于 border-spacing 属性）。
• collapse：在这种方式下，相邻单元格的边框会合并成一个单一的边框。这意味着单元格之间不会有边框的间距或重叠，而是形成一个连续的边框。