为什么
为什么和 Tailwind 是您构建任何网站所需的一切
你可以用 div 和 顺风 .表格、跨度、段落和标题都只是额外的复杂性。 div 和 Tailwind 是最好的,因为它们允许快速绘图,div 几乎不提供默认功能,而 Tailwind 使 CSS 成为有趣的部分。
快速制图
当您使用的每个组件都相同时,您可以在几分钟内拼凑出一个网页。是的,您需要返回并添加样式和格式,但无论如何您都需要这样做。我的策略是只用 div 布局整个页面,最初没有类。然后我回到顶部并添加顺风类。根据网页的复杂程度,在 5-20 分钟内,我就有了一个完整的网页。我可以使用格式使其看起来完美,然后将代码模块化为 React 组件。
div 几乎没有默认功能
你可能认为这是一件坏事,但它实际上使它更灵活。您不受 html 软件工程师认为您想要的东西的限制。想象一下尝试使用 h1,但想删除它周围的间距?您需要手动将边距设置为 0。想对 div 做同样的事情吗?只需加入顺风CSS 文本-2xl
一切就绪。如果你想制作一个非常酷的自定义按钮怎么办? div 是完美的,因为您只需要担心要添加的功能,而不是需要删除的功能。它就像几个顺风类和一个 onclick 回调一样简单。想要水平布局组件,又不想为每个元素使用不同的 css 类? 柔性
加上 justify-content 的变体使其变得轻而易举。
顺风使 CSS
乐趣
我知道这是一个不受欢迎的观点,但 Tailwind 是我最喜欢的 CSS 库。它会产生荒谬的类名,我知道这有时会很烦人。但是,一旦您习惯了阅读类名,您就可以更快地添加样式或调试页面。类名背后没有隐藏任何东西,他们完全按照他们所说的去做。想弄清楚为什么该标题上方有太多空间,请查找 米
或者 p
.它必须在那里。当您使用没有预附加 CSS 的 div 时尤其如此。自从我切换到 Tailwind 之后,我不必在浏览器中挖掘类的层级来找出为什么我的文本是绿色而不是蓝色的,因为我可以直接搜索 text-green。
是的,还有其他 HTML 组件的有效用途。表格是显示大量数据的救星。 header、footer 和 main 应该包含代码的相关部分。如果你想显示任何图像,你显然需要 img 。然而,对于所有其他复杂的布局,div 和 Tailwind 允许您快速、可扩展地创建复杂的现代网页。你的代码完全按照你的想法去做,它可以快速起草,而且 CSS 不再是一件苦差事。下一步是添加一个 Javascript UI 库,例如 反应 , 或者 苗条 .他们将您的发展提升到一个新的水平。
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 无需6万激活码!GitHub神秘组织3小时极速复刻Manus,手把手教你使用OpenManus搭建本
· Manus爆火,是硬核还是营销?
· 终于写完轮子一部分:tcp代理 了,记录一下
· 别再用vector<bool>了!Google高级工程师:这可能是STL最大的设计失误
· 单元测试从入门到精通