LwuCSS

Appearance

On this page

间距 ​

内边距 ​

控制元素内边距的功能类

使用前缀 ​

为了防止和开发者项目中的其他原子化样式语法冲突，样式库默认添加了前缀 lwu，使用示例如下：

vue
<view class="lwu-flex"></view>

语法 ​

0-3，步进0.5 ​

ClassProperties平台兼容性说明
p-0padding: 0px;H5、小程序、app-vue、app-nvue
px-0padding-left: 0px;
padding-right: 0px;		H5、小程序、app-vue、app-nvue
py-0padding-top: 0px;
padding-bottom: 0px;		H5、小程序、app-vue、app-nvue
pt-0padding-top: 0px;
H5、小程序、app-vue、app-nvue
pr-0padding-right: 0px;
H5、小程序、app-vue、app-nvue
pb-0padding-bottom: 0px;
H5、小程序、app-vue、app-nvue
pl-0padding-left: 0px;
H5、小程序、app-vue、app-nvue
p-pxpadding: 1px;H5、小程序、app-vue、app-nvue
px-pxpadding-left: 1px;
padding-right: 1px;		H5、小程序、app-vue、app-nvue
py-pxpadding-top: 1px;
padding-bottom: 1px;		H5、小程序、app-vue、app-nvue
pt-pxpadding-top: 1px;
H5、小程序、app-vue、app-nvue
pr-pxpadding-right: 1px;
H5、小程序、app-vue、app-nvue
pb-pxpadding-bottom: 1px;
H5、小程序、app-vue、app-nvue
pl-pxpadding-left: 1px;
H5、小程序、app-vue、app-nvue
p-0.5padding: 0.125 * 1rem;H5、小程序、app-vue
px-0.5padding-left: 0.125 * 1rem;
padding-right: 0.125 * 1rem;		H5、小程序、app-vue、app-nvue
py-0.5padding-top: 0.125 * 1rem;
padding-bottom: 0.125 * 1rem;		H5、小程序、app-vue、app-nvue
pt-0.5padding-top: 0.125 * 1rem;H5、小程序、app-vue、app-nvue
pr-0.5padding-right: 0.125 * 1rem;H5、小程序、app-vue、app-nvue
pb-0.5padding-bottom: 0.125 * 1rem;H5、小程序、app-vue、app-nvue
pl-0.5padding-left: 0.125 * 1rem;H5、小程序、app-vue、app-nvue
p-1padding: 0.25 * 1rem;H5、小程序、app-vue、app-nvue
px-1padding-left: 0.25 * 1rem;
padding-right: 0.25 * 1rem;		H5、小程序、app-vue、app-nvue
py-1padding-top: 0.25 * 1rem;
padding-bottom: 0.25 * 1rem;		H5、小程序、app-vue、app-nvue
pt-1padding-top: 0.25 * 1rem;H5、小程序、app-vue、app-nvue
pr-1padding-right: 0.25 * 1rem;H5、小程序、app-vue、app-nvue
pb-1padding-bottom: 0.25 * 1rem;H5、小程序、app-vue、app-nvue
pl-1padding-left: 0.25 * 1rem;H5、小程序、app-vue、app-nvue
p-1.5padding: 0.375 * 1rem;H5、小程序、app-vue、app-nvue
px-1.5padding-left: 0.375 * 1rem;
padding-right: 0.375 * 1rem;		H5、小程序、app-vue、app-nvue
py-1.5padding-top: 0.375 * 1rem;
padding-bottom: 0.375 * 1rem;		H5、小程序、app-vue、app-nvue
pt-1.5padding-top: 0.375 * 1rem;
H5、小程序、app-vue、app-nvue
pr-1.5padding-right: 0.375 * 1rem;
H5、小程序、app-vue、app-nvue
pb-1.5padding-bottom: 0.375 * 1rem;
H5、小程序、app-vue、app-nvue
pl-1.5padding-left: 0.375 * 1rem;
H5、小程序、app-vue、app-nvue
p-2padding: 0.5 * 1rem;H5、小程序、app-vue、app-nvue
px-2padding-left: 0.5 * 1rem;
padding-right: 0.5 * 1rem;		H5、小程序、app-vue、app-nvue
py-2padding-top: 0.5 * 1rem;
padding-bottom: 0.5 * 1rem;		H5、小程序、app-vue、app-nvue
pt-2padding-top: 0.5 * 1rem;
H5、小程序、app-vue、app-nvue
pr-2padding-right: 0.5 * 1rem;
H5、小程序、app-vue、app-nvue
pb-2padding-bottom: 0.5 * 1rem;
H5、小程序、app-vue、app-nvue
pl-2padding-left: 0.5 * 1rem;
H5、小程序、app-vue、app-nvue
p-2.5padding: 0.625 * 1rem;H5、小程序、app-vue、app-nvue
px-2.5padding-left: 0.625 * 1rem;
padding-right: 0.625 * 1rem;		H5、小程序、app-vue、app-nvue
py-2.5padding-top: 0.625 * 1rem;
padding-bottom: 0.625 * 1rem;		H5、小程序、app-vue、app-nvue
pt-2.5padding-top: 0.625 * 1rem;
H5、小程序、app-vue、app-nvue
pr-2.5padding-right: 0.625 * 1rem;
H5、小程序、app-vue、app-nvue
pb-2.5padding-bottom: 0.625 * 1rem;
H5、小程序、app-vue、app-nvue
pl-2.5padding-left: 0.625 * 1rem;
H5、小程序、app-vue、app-nvue
p-3padding: 0.75 * 1rem;H5、小程序、app-vue、app-nvue
px-3padding-left: 0.75 * 1rem;
padding-right: 0.75 * 1rem;		H5、小程序、app-vue、app-nvue
py-3padding-top: 0.75 * 1rem;
padding-bottom: 0.75 * 1rem;		H5、小程序、app-vue、app-nvue
pt-3padding-top: 0.75 * 1rem;
H5、小程序、app-vue、app-nvue
pr-3padding-right: 0.75 * 1rem;
H5、小程序、app-vue、app-nvue
pb-3padding-bottom: 0.75 * 1rem;
H5、小程序、app-vue、app-nvue
pl-3padding-left: 0.75 * 1rem;
H5、小程序、app-vue、app-nvue
p-3.5padding: 0.875 * 1rem;H5、小程序、app-vue、app-nvue
px-3.5padding-left: 0.875 * 1rem;
padding-right: 0.875 * 1rem;		H5、小程序、app-vue、app-nvue
py-3.5padding-top: 0.875 * 1rem;
padding-bottom: 0.875 * 1rem;		H5、小程序、app-vue、app-nvue
pt-3.5padding-top: 0.875 * 1rem;
H5、小程序、app-vue、app-nvue
pr-3.5padding-right: 0.875 * 1rem;
H5、小程序、app-vue、app-nvue
pb-3.5padding-bottom: 0.875 * 1rem;
H5、小程序、app-vue、app-nvue
pl-3.5padding-left: 0.875 * 1rem;
H5、小程序、app-vue、app-nvue

4-12，步进1 ​

ClassProperties平台兼容性说明
p-4padding: 1rem;H5、小程序、app-vue、app-nvue
px-4padding-left: 1rem;
padding-right: 1rem;		H5、小程序、app-vue、app-nvue
py-4padding-top: 1rem;
padding-bottom: 1rem;		H5、小程序、app-vue、app-nvue
pt-4padding-top: 1rem;
H5、小程序、app-vue、app-nvue
pr-4padding-right: 1rem;
H5、小程序、app-vue、app-nvue
pb-4padding-bottom: 1rem;
H5、小程序、app-vue、app-nvue
pl-4padding-left: 1rem;
H5、小程序、app-vue、app-nvue
p-5padding: 1.25rem;H5、小程序、app-vue、app-nvue
px-5padding-left: 1.25rem;
padding-right: 1.25rem;		H5、小程序、app-vue、app-nvue
py-5padding-top: 1.25rem;
padding-bottom: 1.25rem;		H5、小程序、app-vue、app-nvue
pt-5padding-top: 1.25rem;
H5、小程序、app-vue、app-nvue
pr-5padding-right: 1.25rem;
H5、小程序、app-vue、app-nvue
pb-5padding-bottom: 1.25rem;
H5、小程序、app-vue、app-nvue
pl-5padding-left: 1.25rem;
H5、小程序、app-vue、app-nvue
p-6padding: 1.5rem;H5、小程序、app-vue、app-nvue
px-6padding-left: 1.5rem;
padding-right: 1.5rem;		H5、小程序、app-vue、app-nvue
py-6padding-top: 1.5rem;
padding-bottom: 1.5rem;		H5、小程序、app-vue、app-nvue
pt-6padding-top: 1.5rem;
H5、小程序、app-vue、app-nvue
pr-6padding-right: 1.5rem;
H5、小程序、app-vue、app-nvue
pb-6padding-bottom: 1.5rem;
H5、小程序、app-vue、app-nvue
pl-6padding-left: 1.5rem;
H5、小程序、app-vue、app-nvue
p-7padding: 1.75rem;H5、小程序、app-vue、app-nvue
px-7padding-left: 1.75rem;
padding-right: 1.75rem;		H5、小程序、app-vue、app-nvue
py-7padding-top: 1.75rem;
padding-bottom: 1.75rem;		H5、小程序、app-vue、app-nvue
pt-7padding-top: 1.75rem;
H5、小程序、app-vue、app-nvue
pr-7padding-right: 1.75rem;
H5、小程序、app-vue、app-nvue
pb-7padding-bottom: 1.75rem;
H5、小程序、app-vue、app-nvue
pl-7padding-left: 1.75rem;
H5、小程序、app-vue、app-nvue
p-8padding: 2rem;H5、小程序、app-vue、app-nvue
px-8padding-left: 2rem;
padding-right: 2rem;		H5、小程序、app-vue、app-nvue
py-8padding-top: 2rem;
padding-bottom: 2rem;		H5、小程序、app-vue、app-nvue
pt-8padding-top: 2rem;
H5、小程序、app-vue、app-nvue
pr-8padding-right: 2rem;
H5、小程序、app-vue、app-nvue
pb-8padding-bottom: 2rem;
H5、小程序、app-vue、app-nvue
pl-8padding-left: 2rem;
H5、小程序、app-vue、app-nvue
p-9padding: 2.25rem;H5、小程序、app-vue、app-nvue
px-9padding-left: 2.25rem;
padding-right: 2.25rem;		H5、小程序、app-vue、app-nvue
py-9padding-top: 2.25rem;
padding-bottom: 2.25rem;		H5、小程序、app-vue、app-nvue
pt-9padding-top: 2.25rem;
H5、小程序、app-vue、app-nvue
pr-9padding-right: 2.25rem;
H5、小程序、app-vue、app-nvue
pb-9padding-bottom: 2.25rem;
H5、小程序、app-vue、app-nvue
pl-9padding-left: 2.25rem;
H5、小程序、app-vue、app-nvue
p-10padding: 2.5rem;H5、小程序、app-vue、app-nvue
px-10padding-left: 2.5rem;
padding-right: 2.5rem;		H5、小程序、app-vue、app-nvue
py-10padding-top: 2.5rem;
padding-bottom: 2.5rem;		H5、小程序、app-vue、app-nvue
pt-10padding-top: 2.5rem;
H5、小程序、app-vue、app-nvue
pr-10padding-right: 2.5rem;
H5、小程序、app-vue、app-nvue
pb-10padding-bottom: 2.5rem;
H5、小程序、app-vue、app-nvue
pl-10padding-left: 2.5rem;
H5、小程序、app-vue、app-nvue
p-11padding: 2.75rem;H5、小程序、app-vue、app-nvue
px-11padding-left: 2.75rem;
padding-right: 2.75rem;		H5、小程序、app-vue、app-nvue
py-11padding-top: 2.75rem;
padding-bottom: 2.75rem;		H5、小程序、app-vue、app-nvue
pt-11padding-top: 2.75rem;
H5、小程序、app-vue、app-nvue
pr-11padding-right: 2.75rem;
H5、小程序、app-vue、app-nvue
pb-11padding-bottom: 2.75rem;
H5、小程序、app-vue、app-nvue
pl-11padding-left: 2.75rem;
H5、小程序、app-vue、app-nvue
p-12padding: 3rem;H5、小程序、app-vue、app-nvue
px-12padding-left: 3rem;
padding-right: 3rem;		H5、小程序、app-vue、app-nvue
py-12padding-top: 3rem;
padding-bottom: 3rem;		H5、小程序、app-vue、app-nvue
pt-12padding-top: 3rem;
H5、小程序、app-vue、app-nvue
pr-12padding-right: 3rem;
H5、小程序、app-vue、app-nvue
pb-12padding-bottom: 3rem;
H5、小程序、app-vue、app-nvue
pl-12padding-left: 3rem;
H5、小程序、app-vue、app-nvue

14 ​

ClassProperties平台兼容性说明
p-14padding: 3.5rem;H5、小程序、app-vue、app-nvue
px-14padding-left: 3.5rem;
padding-right: 3.5rem;		H5、小程序、app-vue、app-nvue
py-14padding-top: 3.5rem;
padding-bottom: 3.5rem;		H5、小程序、app-vue、app-nvue
pt-14padding-top: 3.5rem;
H5、小程序、app-vue、app-nvue
pr-14padding-right: 3.5rem;
H5、小程序、app-vue、app-nvue
pb-14padding-bottom: 3.5rem;
H5、小程序、app-vue、app-nvue
pl-14padding-left: 3.5rem;
H5、小程序、app-vue、app-nvue

16-64，进步4 ​

ClassProperties平台兼容性说明
p-16padding: 4rem;H5、小程序、app-vue、app-nvue
px-16padding-left: 4rem;
padding-right: 4rem;		H5、小程序、app-vue、app-nvue
py-16padding-top: 4rem;
padding-bottom: 4rem;		H5、小程序、app-vue、app-nvue
pt-16padding-top: 4rem;
H5、小程序、app-vue、app-nvue
pr-16padding-right: 4rem;
H5、小程序、app-vue、app-nvue
pb-16padding-bottom: 4rem;
H5、小程序、app-vue、app-nvue
pl-16padding-left: 4rem;
H5、小程序、app-vue、app-nvue
p-20padding: 5rem;H5、小程序、app-vue、app-nvue
px-20padding-left: 5rem;
padding-right: 5rem;		H5、小程序、app-vue、app-nvue
py-20padding-top: 5rem;
padding-bottom: 5rem;		H5、小程序、app-vue、app-nvue
pt-20padding-top: 5rem;
H5、小程序、app-vue、app-nvue
pr-20padding-right: 5rem;
H5、小程序、app-vue、app-nvue
pb-20padding-bottom: 5rem;
H5、小程序、app-vue、app-nvue
pl-20padding-left: 5rem;
H5、小程序、app-vue、app-nvue
p-24padding: 6rem;H5、小程序、app-vue、app-nvue
px-24padding-left: 6rem;
padding-right: 6rem;		H5、小程序、app-vue、app-nvue
py-24padding-top: 6rem;
padding-bottom: 6rem;		H5、小程序、app-vue、app-nvue
pt-24padding-top: 6rem;
H5、小程序、app-vue、app-nvue
pr-24padding-right: 6rem;
H5、小程序、app-vue、app-nvue
pb-24padding-bottom: 6rem;
H5、小程序、app-vue、app-nvue
pl-24padding-left: 6rem;
H5、小程序、app-vue、app-nvue
p-28padding: 7rem;H5、小程序、app-vue、app-nvue
px-28padding-left: 7rem;
padding-right: 7rem;		H5、小程序、app-vue、app-nvue
py-28padding-top: 7rem;
padding-bottom: 7rem;		H5、小程序、app-vue、app-nvue
pt-28padding-top: 7rem;
H5、小程序、app-vue、app-nvue
pr-28padding-right: 7rem;
H5、小程序、app-vue、app-nvue
pb-28padding-bottom: 7rem;
H5、小程序、app-vue、app-nvue
pl-28padding-left: 7rem;
H5、小程序、app-vue、app-nvue
p-32padding: 8rem;H5、小程序、app-vue、app-nvue
px-32padding-left: 8rem;
padding-right: 8rem;		H5、小程序、app-vue、app-nvue
py-32padding-top: 8rem;
padding-bottom: 8rem;		H5、小程序、app-vue、app-nvue
pt-32padding-top: 8rem;
H5、小程序、app-vue、app-nvue
pr-32padding-right: 8rem;
H5、小程序、app-vue、app-nvue
pb-32padding-bottom: 8rem;
H5、小程序、app-vue、app-nvue
pl-32padding-left: 8rem;
H5、小程序、app-vue、app-nvue
p-36padding: 9rem;H5、小程序、app-vue、app-nvue
px-36padding-left: 9rem;
padding-right: 9rem;		H5、小程序、app-vue、app-nvue
py-36padding-top: 9rem;
padding-bottom: 9rem;		H5、小程序、app-vue、app-nvue
pt-36padding-top: 9rem;
H5、小程序、app-vue、app-nvue
pr-36padding-right: 9rem;
H5、小程序、app-vue、app-nvue
pb-36padding-bottom: 9rem;
H5、小程序、app-vue、app-nvue
pl-36padding-left: 9rem;
H5、小程序、app-vue、app-nvue
p-40padding: 10rem;H5、小程序、app-vue、app-nvue
px-40padding-left: 10rem;
padding-right: 10rem;		H5、小程序、app-vue、app-nvue
py-40padding-top: 10rem;
padding-bottom: 10rem;		H5、小程序、app-vue、app-nvue
pt-40padding-top: 10rem;
H5、小程序、app-vue、app-nvue
pr-40padding-right: 10rem;
H5、小程序、app-vue、app-nvue
pb-40padding-bottom: 10rem;
H5、小程序、app-vue、app-nvue
pl-40padding-left: 10rem;
H5、小程序、app-vue、app-nvue
p-44padding: 11rem;H5、小程序、app-vue、app-nvue
px-44padding-left: 11rem;
padding-right: 11rem;		H5、小程序、app-vue、app-nvue
py-44padding-top: 11rem;
padding-bottom: 11rem;		H5、小程序、app-vue、app-nvue
pt-44padding-top: 11rem;
H5、小程序、app-vue、app-nvue
pr-44padding-right: 11rem;
H5、小程序、app-vue、app-nvue
pb-44padding-bottom: 11rem;
H5、小程序、app-vue、app-nvue
pl-44padding-left: 11rem;
H5、小程序、app-vue、app-nvue
p-48padding: 12rem;H5、小程序、app-vue、app-nvue
px-48padding-left: 12rem;
padding-right: 12rem;		H5、小程序、app-vue、app-nvue
py-48padding-top: 12rem;
padding-bottom: 12rem;		H5、小程序、app-vue、app-nvue
pt-48padding-top: 12rem;
H5、小程序、app-vue、app-nvue
pr-48padding-right: 12rem;
H5、小程序、app-vue、app-nvue
pb-48padding-bottom: 12rem;
H5、小程序、app-vue、app-nvue
pl-48padding-left: 12rem;
H5、小程序、app-vue、app-nvue
p-52padding: 13rem;H5、小程序、app-vue、app-nvue
px-52padding-left: 13rem;
padding-right: 13rem;		H5、小程序、app-vue、app-nvue
py-52padding-top: 13rem;
padding-bottom: 13rem;		H5、小程序、app-vue、app-nvue
pt-52padding-top: 13rem;
H5、小程序、app-vue、app-nvue
pr-52padding-right: 13rem;
H5、小程序、app-vue、app-nvue
pb-52padding-bottom: 13rem;
H5、小程序、app-vue、app-nvue
pl-52padding-left: 13rem;
H5、小程序、app-vue、app-nvue
p-56padding: 14rem;H5、小程序、app-vue、app-nvue
px-56padding-left: 14rem;
padding-right: 14rem;		H5、小程序、app-vue、app-nvue
py-56padding-top: 14rem;
padding-bottom: 14rem;		H5、小程序、app-vue、app-nvue
pt-56padding-top: 14rem;
H5、小程序、app-vue、app-nvue
pr-56padding-right: 14rem;
H5、小程序、app-vue、app-nvue
pb-56padding-bottom: 14rem;
H5、小程序、app-vue、app-nvue
pl-56padding-left: 14rem;
H5、小程序、app-vue、app-nvue
p-60padding: 15rem;H5、小程序、app-vue、app-nvue
px-60padding-left: 15rem;
padding-right: 15rem;		H5、小程序、app-vue、app-nvue
py-60padding-top: 15rem;
padding-bottom: 15rem;		H5、小程序、app-vue、app-nvue
pt-60padding-top: 15rem;
H5、小程序、app-vue、app-nvue
pr-60padding-right: 15rem;
H5、小程序、app-vue、app-nvue
pb-60padding-bottom: 15rem;
H5、小程序、app-vue、app-nvue
pl-60padding-left: 15rem;
H5、小程序、app-vue、app-nvue
p-64padding: 16rem;H5、小程序、app-vue、app-nvue
px-64padding-left: 16rem;
padding-right: 16rem;		H5、小程序、app-vue、app-nvue
py-64padding-top: 16rem;
padding-bottom: 16rem;		H5、小程序、app-vue、app-nvue
pt-64padding-top: 16rem;
H5、小程序、app-vue、app-nvue
pr-64padding-right: 16rem;
H5、小程序、app-vue、app-nvue
pb-64padding-bottom: 16rem;
H5、小程序、app-vue、app-nvue
pl-64padding-left: 16rem;
H5、小程序、app-vue、app-nvue

72、80、96 ​

ClassProperties平台兼容性说明
p-72padding: 18rem;H5、小程序、app-vue、app-nvue
px-72padding-left: 18rem;
padding-right: 18rem;		H5、小程序、app-vue、app-nvue
py-72padding-top: 18rem;
padding-bottom: 18rem;		H5、小程序、app-vue、app-nvue
pt-72padding-top: 18rem;
H5、小程序、app-vue、app-nvue
pr-72padding-right: 18rem;
H5、小程序、app-vue、app-nvue
pb-72padding-bottom: 18rem;
H5、小程序、app-vue、app-nvue
pl-72padding-left: 18rem;
H5、小程序、app-vue、app-nvue
p-80padding: 20rem;H5、小程序、app-vue、app-nvue
px-80padding-left: 20rem;
padding-right: 20rem;		H5、小程序、app-vue、app-nvue
py-80padding-top: 20rem;
padding-bottom: 20rem;		H5、小程序、app-vue、app-nvue
pt-80padding-top: 20rem;
H5、小程序、app-vue、app-nvue
pr-80padding-right: 20rem;
H5、小程序、app-vue、app-nvue
pb-80padding-bottom: 20rem;
H5、小程序、app-vue、app-nvue
pl-80padding-left: 20rem;
H5、小程序、app-vue、app-nvue
p-96padding: 24rem;H5、小程序、app-vue、app-nvue
px-96padding-left: 24rem;
padding-right: 24rem;		H5、小程序、app-vue、app-nvue
py-96padding-top: 24rem;
padding-bottom: 24rem;		H5、小程序、app-vue、app-nvue
pt-96padding-top: 24rem;
H5、小程序、app-vue、app-nvue
pr-96padding-right: 24rem;
H5、小程序、app-vue、app-nvue
pb-96padding-bottom: 24rem;
H5、小程序、app-vue、app-nvue
pl-96padding-left: 24rem;
H5、小程序、app-vue、app-nvue