<p></p>是段落标签，也就块元素。
<div></div>也是块元素.
<span>是内联元素
块状元素：独占一行，width和height起作用
内联元素：width和heigh不起作用，不占一行
举例说明：
image.png
如上，如果产品的名称用span来显示的话：
<span className="w-3/5 bold heading6 text-black">The product name can be longer and occupy two lines</span>
效果如下：
image.png
如果用p标签来显示的话,代码如下：
<p className="w-3/5 bold heading6 text-black">The product name can be longer and occupy two lines</p>
效果如图：
image.png
差异一目了然了吧。
flex： 将对象作为弹性伸缩盒显示
inline-flex：将对象作为内联块级弹性伸缩盒显示
一句话来描述就是 当Flex Box 容器没有设置宽度大小限制时，当display 指定为 flex 时，FlexBox 的宽度会填充父容器，当display指定为 inline-flex 时，FlexBox的宽度会包裹子Item.
网友评论