Tailwind CSS:有没有办法定位下一个兄弟?

2024-02-11

我有一个带有如下标签的无线电输入。输入被隐藏,标签用于制作一个视觉上吸引人的圆圈供用户单击。

<input id="choice-yes" type="radio" class="opacity-0 w-0 fixed"/>
<label for="choice-yes" class="transition  duration-500 bg-blue-300 hover:bg-blue-500 w-20 h-20 rounded-full mr-5 flex items-center align-middle justify-center">Yes</label>

当用户单击标签输入时进行检查。我正在尝试找出如何瞄准这一点,这样我就可以给这个标签带来不同的风格。

这可以在纯 CSS 中使用下一个同级选择器来实现。

input[type="radio"]:checked + label {
  background-color: #bfb !important;
  border-color: #4c4 !important;
}

我可以使用 tailwind.css 中类似的东西吗?


对于那些希望实现这一点的人,自从引入即时模式(Tailwind CSS v2.1+)以来兄弟选择器变体 https://tailwindcss.com/docs/just-in-time-mode#sibling-selector-variants可用。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Tailwind CSS:有没有办法定位下一个兄弟? 的相关文章

随机推荐

  • 为什么 RestKit 改变我的响应内容类型?

    简而言之 我尝试使用以下命令从服务器获取数据content typehttp请求头设置为 text html 但由于某种原因 RestKit 将其更改为application JSON 解释 如果我只使用AF网络 https github
  • 从领域数据库中获取单个列 (Android)

    我是领域的初学者 我有一个包含 3 列的表 其名称为ID 姓名 电子邮件 地址 为了获取 Name 列的数据 我们使用如下查询 从表名中选择名称 对于 SQLite 如果我们在Android中使用Realm 那么我们必须使用哪种方法来只获取
  • jinja2 如何删除尾随换行符

    我正在使用 jinja 2 输出 yaml 文件 但似乎无法摆脱尾随换行符和 for 循环的末尾 例如下面的 request path path headers origin somedomain com user agent agent
  • 解雇ViewController:不工作

    我有一个名为 vc0 的视图控制器 其显示如下 self presentViewController vc1 animated YES completion nil 在 vc1 中 我有一个按钮来呈现另一个视图控制器 self presen
  • 获取 Java 数组部分的视图[重复]

    这个问题在这里已经有答案了 我指的是在Java中只获取数组的一部分 https stackoverflow com questions 11001720 get only part of an array in java 它使用范围复制 方
  • set_time_limit 不起作用

    我有一个bigintphp 中的类 用于计算大数 除了时间限制外 效果很好 我设置了时间限制 set time limit 900 在我的 bigint php 文件中 它在本地主机中工作 但在我的网络主机中 当我尝试计算 999 999
  • Angular 7:如何将文件/图像与我的反应式表单一起提交?

    我创建了带有文本输入的简单反应式表单 当提交表单时 我想传递文件输入中的图像 每次我用谷歌搜索时 我都会得到教程 它们向我展示如何上传文件 但它是在没有其他输入字段的情况下完成的 我知道如何做到这一点 但我不明白如何在一次提交中提交表单和文
  • 带 MonoTouch 的 sizeWithFont

    MonoTouch 中的 sizeWithFont 相当于什么 如果没有这样的方法 是否可以通过其他方式调用它 我想做的就是根据文本调整标签大小 下一个更新 MonoTouch 1 1 将提供 UIView StringSize strin
  • NSURLErrorDomain错误代码1002描述

    我是新来的iOS发展 我正在尝试加载一个JSON 这是我的功能 func loadmyJSON urlPath String let url NSURL NSURL string urlPath let session NSURLSessi
  • 从 SQLite 中的 DATETIME 获取月份

    我正在尝试从 a 中提取月份DATETIMESQLite 中的字段 month dateField 效果不太好strftime m dateStart 有任何想法吗 我不明白 答案就在你的问题中 select strftime m date
  • 如何通过 Websocket 发送文件以及附加信息?

    我正在开发一个 Web 应用程序 用于从管理界面将图像 视频等发送到两个显示器 我在服务器端使用 Node js 中的 ws 我已经实现了选择服务器上可用的图像和外部 URL 并将它们发送到客户端 但我也希望能够通过文件输入直接发送从设备中
  • 单选按钮单击和重新单击

    我在 Android 中有一个单选按钮组 选择项目时我会收到事件 目前为止还正常 但如果用户单击已选择的项目 我不会收到该事件 有没有办法知道 接收事件 用户何时点击单选按钮 无论它是否被选择 多谢 我不明白为什么当单击已选中的单选按钮时会
  • c++11 std::hash 函数对象类线程安全

    在 c 11 中声明的哈希函数类对象
  • 使用共享存储库模型的 GitHub 协作

    有人可以向我提供 GitHub 协作备忘单 供希望对存储库具有平等访问 权利的两人团队使用吗 我对使用分叉的必要性感到困惑 这对于开发人员分散的大型开源项目来说似乎是有意义的 但当我和我的搭档彼此相距 10 英尺时 似乎有点矫枉过正 Tha
  • Git:如何在同一分支中的提交之上重新建立分支? [复制]

    这个问题在这里已经有答案了 参考文献这个优秀的答案 https stackoverflow com a 38430972 3398271 我读过并且 我认为 我理解了 但据我所知并没有回答我的具体问题 因为它解释了如何重新基于提交中的提交
  • Selenium Firefox IDE 可以实现吗?

    这是这个问题的后续 想要创建一个表单填充程序 java jsp html 足够吗 https stackoverflow com questions 17329996 want to create a form filler is java
  • Dropbox Saver 可以接受来自 createObjectURL() 的数据吗?

    Dropbox Chooser 和 Saver 工具 https www dropbox com developers dropins对于这两项任务来说似乎非常酷 让用户从 Dropbox 中选择一个文件 页面就可以下载它 即 Dropbo
  • 块与 Objective-C 中的普通方法和函数有何不同?

    与 Objective C 中的普通方法和函数相比 使用块有什么优势 我已阅读文档 但找不到块而不是其他语言功能的具体用法 我确信我错过了一些东西 所以有人可以用比现有文档更简单的方式解释块的优点吗 块是一种包装一段代码并有效存储它以供以后
  • 将 Angularjs 和 Rails 应用程序分离为独立组件

    我想尝试一下 Angularjs 然而 我一直难以决定应该将我的角度应用程序放在哪里 我使用 Rails 框架作为后端 我看过教程 其中整个角度应用程序都位于 asset javascript 文件夹下 我想知道是否可以让它完全位于我的ra
  • Tailwind CSS:有没有办法定位下一个兄弟?

    我有一个带有如下标签的无线电输入 输入被隐藏 标签用于制作一个视觉上吸引人的圆圈供用户单击