我用 nextjs14+typescript+tailwindcss 做了一个网站 https://www.all-free-novels.com ,最开始是按照 web 版本来做的,后面想要优化的时候开始做移动端,在做移动端适配时,希望实现“block md:hidden”的功能,也就是某个组件,比如导航栏,在移动端时显示成图标的样子,而到了 md 时该图标则隐藏,显示成文字版的导航栏 目前发现 hidden md:block 是有效的,但是 block md:hidden 无效
尝试了很多方案,很奇怪 本人小白前端新手,有哪位大神可以看看是什么问题吗?
1
xiaoqidev 237 天前
提供一个线上无效的示例链接看看呢
|
2
zhhanging 237 天前
在你的网站上我没看到哪个元素有 block md:hidden
|
3
dudubaba 237 天前
盲猜样式层级问题,试试 block md:hidden!
|
4
colorcat 237 天前
tailwind.config.ts 配置
{ important: true, } |
5
YouMoeYi 236 天前
好奇书源
|
6
vvong 236 天前
在线中译英么 搞不定上下文的问题吧 而且你这样的翻译接口容易被刷啊 api 翻译接口也有频率限制
|
7
chnwillliu 236 天前 via Android
tailwind 是 mobile first 的策略,没有前缀的是 apply 所有屏幕,md 是中宽度及以上更宽的屏幕。block md:hidden 的意思是默认 display block md 及以上 hidden 。
OP 有可能搞反了。 |
8
vczyh 236 天前
hidden md:block 默认隐藏,超过 md 显示
block md:hidden 默认显示,超过 md 隐藏 应该这样理解吧? |