font-weight: 400; src: url(/fonts/proxima-nova/400-regular.woff) format("woff"); } @font-face { font-family: Proxima Nova; font-weight: 500; src: url(/fonts/proxima-nova/500-medium.woff) format("woff"); } } 查看完整回答 反对 回复 2023-10-10 皈依舞 TA贡献1851条经验 获得超3个...
italic 即 font-style: italic; font-thin 即 font-weight: 100; font-light 即 font-weight: 300; font-normal 即 font-weight: 400; font-bold 即 font-weight: 700; font-black 即 font-weight: 900; 6. 颜色 透明 渐变 <p className="text-red-500">islandZzz -- 文本颜色</p><pclassName="b...
将字体上传到网站放到指定目录下,如 resources/font/方正鲁迅简体改个名.ttf 第二步:在css文件中导入本字体 # /www/livewire-tutorial/01/resources/sass/app.scss样式文件 @tailwind base; @tailwind components; @tailwind utilities; @layer base { @font-face { font-family: Sui Bian; font-weight: 400;...
@font-face 规则 您可以使用相同的方式为您正在使用的任何自定义字体添加@font-face规则。 @tailwindbase;@tailwindcomponents;@tailwindutilities;@layerbase{@font-face{font-family:Proxima Nova;font-weight:400;src:url(/fonts/proxima-nova/400-regular.woff)format("woff");}@font-face{font-family:Proxima ...
组合多个实用程序类:第 14 行中组合了多个类,即bg-green、font-weight-400和text-underline。这些样式在 Hello world 3 文本中都生效了。 实用程序类的可重用性:第 12 行和第 14 行中多次使用了text-underline类。 当然,如果想遵循这种原子 CSS 架构,就需要创建多个单一用途的实用程序类。这就是 Tailwind CSS...
要设置字符粗细,请使用 font- {thickness}。厚度可以取 9 个值。相应的 CSS 样式在括号中。 .font-thin (font-weight: 100;) .font-extralight (font-weight: 200;) .font-light (font-weight: 300;) .font-normal (font-weight: 400;) .font-medium (font-weight: 500;) .font-semibold (font-weig...
例如,font-weight: 600; 究竟是对应 font-bold 还是font-semibold,而 font-600 很明确了。 当然并不是语义标签总是不好的,并不是都是使用数字标签,需要确定哪种方式让我们使用起来更加受益。 fontWeight: { thin: '100', extralight: '200', light: '300', normal: '400', medium: '500', semibold: ...
font-weight: 400; @tailwind base; @tailwind components; @tailwind utilities; color-scheme: light dark; color: rgba(255, 255, 255, 0.87); background-color: #242424; font-synthesis: none; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscal...
font-weight:400; } body{ @apply bg-green-100p-5m-0w-full h-screen; } import 可以修改 改成 import HelloWorldfrom'@components/HelloWorld.vue' WORKS Typescript WORKS Tailwind ---完 Setup Vue Router & Store 设置vue路由和存储 1.1 在设置路由器之前...
@font-face { font-display: swap; font-family: 'Nunito'; font-style: normal; font-weight: 400; src: local('Nunito Regular'), local('Nunito-Regular'), url('~assets/fonts/Nunito-400-cyrillic-ext1.woff2') format('woff2'); } 0投票 Nuxt Google 字体使用起来有点有趣。我尝试工...