Skip to content

Tiddlywiki Tailwindcss Plus

markdown plugins

直接在 tiddlywiki 里面写 tailwindcss

由于Tailwindcss v4的浏览器不支持typography插件, 所以目前仅仅使用v3最新版本(3.4.16), 3.4.17 官方没有打包浏览器版本.

在线地址

🧩 TIDDLYWIKI TAILWINDCSS-PLUS

Why Tailwindcss

  • 一致性:使用 Tailwind CSS 可确保您的样式在整个 TiddlyWiki 中保持一致。使用 Tailwind 的实用程序类,您可以快速轻松地将样式应用到您的元素,而无需担心跟踪自定义类名称。

  • 模块化:Tailwind CSS 被设计成模块化的,这意味着您可以只使用您需要的部分。这有助于保持您的 TiddlyWiki 精简并避免使用不必要的 CSS 使其膨胀。

  • 易于使用:Tailwind CSS 使用简单,无需设置或配置。您可以立即开始使用它并立即提高工作效率。

  • 可定制性:虽然 Tailwind CSS 提供了一套全面的开箱即用样式,但它还允许您自定义和扩展样式以满足您的特定需求。这可以通过其配置文件或创建您自己的自定义实用程序类来完成。

  • 总体而言,在 TiddlyWiki 中仅使用 Tailwind CSS 可以简化您的样式设置过程,使您的样式更加一致,并减少您需要编写和维护的 CSS 数量。

用法

  • 开箱即用,仅仅写 class 就行. 更多用法请查看 Tailwindcss 官方文档
html
<div class="text-rose-400"> 这是一段有样式的句子 </div>

<div class="text-indigo-400 animate-bounce underline decoration-dotted underline-offset-8"> 这是一段有动画的句子 </div>
这是一段有样式的句子
这是一段有动画的句子

基于 MIT 许可发布