此站点:https://tailwindcss-custom-forms.netlify.app/提供了此示例tailwind.config.js文件: // tailwind.config.js module.exports = { theme: { customForms: theme => ({ dark: { 'input, textarea, multiselect, checkbox, radio': { backgroundColor: theme('colors.gray.900' 浏览4提问于2020-10-2...
bg-currentbackground-color: currentColor; bg-black--tw-bg-opacity: 1; background-color: rgba(0, 0, 0, var(--tw-bg-opacity)); bg-white--tw-bg-opacity: 1; background-color: rgba(255, 255, 255, var(--tw-bg-opacity));
bg-white--tw-bg-opacity: 1; background-color: rgba(255, 255, 255, var(--tw-bg-opacity)); bg-gray-50--tw-bg-opacity: 1; background-color: rgba(249, 250, 251, var(--tw-bg-opacity)); bg-gray-100--tw-bg-opacity: 1; background-color: rgba(243, 244, 246, var(--tw-bg-...
只需要设置几个选项就能完成，并且搭配了 tailwindcss 的 color 系统灵活性也非常的好。
// tailwind.config.js colors: { theme: 'var(--theme-color)', 'theme-blue': 'var(--theme-blue)' }, 你还可以设置同名的属性名分别给文本和背景 // tailwind.config.js textColor: { 'theme': 'var(--theme-color-invert)' }, backgroundColor: { 'theme': 'var(--theme-color)', }, ...
这个样式属于这个层级的节点，那个样式属于那个层级的节点 需要tailwind的人写的 css：开发需要调色板，我...
background-color:#0369a1;} Pseudo-classes, like :hover, :focus, :first-child, and :required 伪类 hover focus focus-within 用来选择和样式化一个元素或者它的任何后代元素获得焦点的情况 focus-visible 用来选择和样式化一个元素或者它的任何后代元素获得焦点的情况,用非指针方法获得焦点时 ...
You could even define these colors using CSS custom properties (variables) to make it easy to switch themes on the client: // tailwind.config.js module.exports = { theme: { colors: { primary: 'var(--color-primary)', secondary: 'var(--color-secondary)', // ... } } } /* In you...
CSS variables 只支持现代浏览器,但是许多客户还在使用IE11,为了兼容IE11 可以使用 postcss 插件postcss-custom-properties 例如下面css: :root{ --color:red; } h1{ color:var(--color); } 1. 2. 3. 4. 5. 6. 经过postcss 的处理,得到下面的css,不支持的css属性, 浏览器会自动忽略。
transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4,0,0.2,1);transition-duration:150ms; 持续时间 duration ...