尧图网络科技YAOTU DIGITAL 获取报价
获取报价
首页 / 资讯中心 / 文章详情

Tailwind css 学习备忘

发布时间:2026/9/25 18:57:34

资讯中心
01
ARTICLE

Tailwind css 学习备忘

Tailwind css 学习备忘
flex布局加在父元素上这个父元素变成 flex 容器它的直接子元素变成 flex 项目且只影响直接子元素默认直接子元素横向排列从左到右。默认主轴水平方向交叉轴垂直方向。justify-* 控制主轴对齐items-*控制交叉轴对齐加在父容器上而不是子元素。只写 justify-center 但父容器不是 flex 布局样式不会生效。justify-center 作用是把子元素在主轴方向居中。在容器上同时加上flex和flex-colflex开启弹性布局flex-col把排列方向设为纵向。在某个 flex 父容器的直接子项上加了flex-1它会自动撑满剩余宽度/高度bg-white/70表示白色背景 70% 不透明度。transition不是让元素动起来而是让某个 CSS 属性的变化变得平滑。过渡常见属性color、background-color、opacity、transformtransform用来对元素进行几何变换常见有平移translate、缩放scale ...button classNamemd:hidden/在md及以上屏幕隐藏这个按钮min-width: 768px
02
RELATED NEWS

相关资讯

更多网站建设与数字化升级内容

03
WHY YAOTU

想打造同款高转化官网?

懂行业、懂生意,从建站到增长一站式陪跑

◈

场景化定制

不做模板站,围绕你的业务场景量身设计,小众不撞款。

◐

营销型架构

以转化目标组织内容与路径,让官网真正带来询盘。

▲

全周期服务

设计、开发、运营、运维一体,上线只是开始。

免费获取你的建站方案

留下需求,专属顾问 24 小时内为你输出方案建议。