font-size、weight
text-[14px] font-size 14px;
font-black font-weight: 900;
width
w-[20px] width:20px;
w-full width:100%
!w-[160px] width: 160px !important;
max-w-[600px] max-width: 600px
background
bg-[#50d71e] background-color:#50d71e
bg-[rgba(0,0,0,0.6)] background:rgba(0,0,0,0.6);
padding
!p-[20px] padding: 20px !important;
pb-[20px] padding-bottom:20px;
color
text-[#50d71e] color:#50d71e
text-center text-align: center
border
border-solid border-style: solid;
border-[#243c5a] border-color:#243c5a
border-b-[1px] border-bottom:1px
border-[1px] border:1px
rounded-[12px] border-radius:12px;
cursor
cursor-pointer cursor: pointer;
行高 line-height
leading-[136px] line-height
多行溢出省略
line-clamp-1 文本超出 1 行后截断并添加省略号
line-clamp-none 取消文本超出隐藏效果
float
float-left float:left
display
flex display:flex
block display:block
inline-block display:inline-block
flex相应属性
items-center align-items: center;
justify-between justify-content: space-between; 左右散开
absolute
position: absolute;
top-[3px] top:3px
transform
translate-y-[-50%] translateY(-50%);
hover
hover:bg-[#f5f5f5] hover:background: #f5f5f5
z-index
z-[200] z-index:200