三十三、Tailwind CSS基础学习笔记之 Tailwind CSS Justify Self

作者: 温新

分类: 【Tailwind CSS】

阅读: 850

时间: 2022-10-08 14:10:03

hi,我是温新,一名PHPer

此笔记基于 Tailwind CSS v3.1.8

justify self 设置 单个 网格元素如何沿着内联轴对齐。

justify-self-auto

格式:<element></element>

说明:根据justify-items-*类来对齐一个元素的值。

<span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important"><!doctype html></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">html</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">lang</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"en"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">head</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">meta</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">charset</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"UTF-8"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">meta</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">name</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"viewport"</span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">          <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">content</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">link</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">href</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"../../dist/mystyle.css"</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">rel</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"stylesheet"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">head</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">body</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"text-center"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">h1</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"text-green-500 text-5xl font-bold"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>Tailwind CSS Justify Self<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">h1</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"grid grid-cols-2 justify-items-stretch"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4 justify-self-auto"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>1<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>2<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>3<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>4<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">body</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">html</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span>

justify-self-start

格式:<element></element>

说明:设置网格元素中的某个元素沿着内联轴起点对齐。

justify-self-center

格式:<element></element>

说明:设置网格元素中的某个元素沿着内联轴中心对齐。

justify-self-end

格式:<element></element>

说明:设置网格元素中的某个元素沿着内联轴终点对齐。

justify-self-stretch

格式:<element></element>

说明:默认值,使内容填充慢整个单元格的宽度。

<span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important"><!doctype html></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">html</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">lang</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"en"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">head</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">meta</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">charset</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"UTF-8"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">meta</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">name</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"viewport"</span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">          <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">content</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">link</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">href</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"../../dist/mystyle.css"</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">rel</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"stylesheet"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">head</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">body</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"text-center"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">h1</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"text-green-500 text-5xl font-bold"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>Tailwind CSS Justify Self<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">h1</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"grid grid-cols-2 justify-items-stretch"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4 justify-self-start"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>1<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>2<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>3<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-500 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>4<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"grid grid-cols-2 justify-items-stretch"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-900 rounded-lg h-12 m-4 justify-self-center"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>1<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-900 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>2<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-900 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>3<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-900 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>4<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"grid grid-cols-2 justify-items-stretch"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-200 rounded-lg h-12 m-4 justify-self-end"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>1<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-200 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>2<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-200 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>3<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-200 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>4<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span style="box-sizing: border-box"></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"grid grid-cols-2 justify-items-stretch"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-400 rounded-lg h-12 m-4 justify-self-stretch"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>1<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-400 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>2<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-400 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>3<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">        <span class="cm-tag cm-bracket" style="box-sizing: border-box"><</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span> <span style="box-sizing: border-box;color: rgb(209, 154, 102) !important">class</span>=<span style="box-sizing: border-box;color: rgb(152, 195, 121) !important">"bg-pink-400 rounded-lg h-12 m-4"</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span>4<span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px">    <span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">div</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">body</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span><br></br><span style="box-sizing: border-box;color: rgb(171, 178, 191);padding-right: 0.1px"><span class="cm-tag cm-bracket" style="box-sizing: border-box"></</span><span style="box-sizing: border-box;color: rgb(224, 108, 117) !important">html</span><span class="cm-tag cm-bracket" style="box-sizing: border-box">></span></span>
请登录后再评论