边框颜色:border border-[color]-[shade] border:添加边框 间隔颜色:divide-[direct] divide-[color]-[shade] divide-[direct]:添加分隔,direct 表示分隔方向,取值 x-横向、y-纵向 Item 1 Item 2 Item 3 轮廓线颜色:outline outline-[color]-[shade] outline:添加轮廓线 OlColor Default ...
Border Colors By default Tailwind makes the entiredefault color paletteavailable as border colors. You cancustomize your color paletteby editing thetheme.colorssection of yourtailwind.config.jsfile, or customize just your border colors using thetheme.borderColorsection. ...
UlColor Green 500 边框颜色:border border-[color]-[shade] border:添加边框 间隔颜色:divide-[direct] divide-[color]-[shade] divide-[direct]:添加分隔,direct表示分隔方向,取值x-横向、y-纵向 Item 1<
UlColor Green 500 边框颜色:border border-[color]-[shade] border:添加边框 间隔颜色:divide-[direct] divide-[color]-[shade] divide-[direct]:添加分隔,direct表示分隔方向,取值x-横向、y-纵向 Item 1<
Tailwind comes with a default color palette that we can use to apply to an element background, border, text, and more. We can also extend more colors if we need. Take a look at a few colors provided in tailwind by default.We can apply any of these colors to an element by adding ...
{ gray: colors.gray, blue: colors.blue, blueGray: colors.blueGray, green: colors.green, yellow: colors.yellow, orange: colors.orange, red: colors.red, }, }, backgroundColor: { white: 'var(--color-bg-white)', main: 'var(--color-bg-main)', input: 'var(--color-bg-input)', ...
Examples Different Outline Widths, Colors, Styles and Offset: 4px double indigo outline. Offset-4px: pink outline. Different Ring widths and colors with Offset widths and colors:
边框:border、border-2(边框宽度) 阴影:shadow、shadow-lg 布局:flex、flex-wrap、justify-center 动画:animate-bounce、animate-pulse 定制化原子类: Tailwind CSS允许你通过配置文件tailwind.config.js来自定义原子类。例如,你可以添加自定义的颜色、字体、边距等。以下是一个简单的自定义示例: module.exports = { ...
它们的工作方式border实用程序非常相似，不同之处在于它们添加了实心的阴影而不是边框，因此不会影响布局：<!-- ... --> 您甚至可以使用ring-offset-{width}实用程序抵消它们以创建某种光环效果：<!-- ... --> 使用一堆CSS自定义属性voodoo，我们甚至还使它们自动与常规的盒子阴影结合在一起：<!-- Both th...
// tailwind.config.jsmodule.exports= {theme: {colors: {indigo:'#5c6ac4',blue:'#007ace',red:'#de3618', } } } By default these colors are automatically shared by the textColor, borderColor, and backgroundColor utilities, so the above configuration would generate classes like .text-indigo...