单选按钮样式

2024-01-10

我想用纯 CSS 设计单选按钮的样式,没有类或 ID。只需输入[type=radio]。 我想对未选择和选择使用背景图像。 然而,-vendor-appearance:none;不适用于 Trident 或 Gecko。只是Webkit。 在这些浏览器中,您可以看到背景图像作为单选按钮的背景,但按钮仍然在那里,而不仅仅是显示图像,我怎样才能摆脱按钮,以便只显示背景图像。小提琴:http://jsfiddle.net/7kScn/ http://jsfiddle.net/7kScn/


您可以使用 CSS2 选择器技巧连接到单选组并立即显示其他内容。

See: http://jsfiddle.net/7kScn/1/ http://jsfiddle.net/7kScn/1/

这只是一个基本示例,但它的运行前提是隐藏输入字段,然后立即对其后面的标签进行样式设置,使其具有您正在检查的实际内容的效果。

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

单选按钮样式 的相关文章

  • 通过 JavaScript 检测浏览器换行

    我需要 javascript 来检测每个浏览器包装的文本行并将其包装到 span class line 我读过一些关于测量每个单词的 y 轴的文章 但还没有看到可靠的解决方案 这是我到目前为止所拥有的 看到它Jsfiddle http js
  • 使用 CSS 的平行四边形导航背景

    我正在尝试创建此导航菜单 绿色突出显示是活动页面 灰色是悬停状态 我可以使用以下 CSS 制作平行四边形 ul nav li a text decoration none padding 4px 10px border radius 3px
  • 垂直对齐复选框标签? [复制]

    这个问题在这里已经有答案了 我有这样的复选框
  • 禁用引导列上的滚动

    我正在尝试禁用引导列上的滚动 这是我的代码 div class container fluid h 100 div class row h 100 div class col 4 h 100 bg dark fixed div div cl
  • 现在 CSS3 供应商前缀有多必要? [复制]

    这个问题在这里已经有答案了 我只是想知道现在在 CSS 中指定 webkit moz ms 或 o 等供应商前缀在多大程度上仍然有必要 如果我理解正确的话 opera 切换到了 webkit 所以会删除 o 对吗 IE 在 IE10 中不再
  • 如何阻止破折号自行包裹?

    我有一个标题 标题最后一个单词的末尾是一个破折号 单词和破折号之间没有空格 当浏览器窗口变小时 破折号会中断并换成新行 在自己的行上有一个破折号是不好的排版 如何停止破折号之前的换行 以便最后一个单词运行到新行 这是代码 h1 XYZ co
  • 如何将嵌套组框中的单选按钮设置为与该组框外部的单选按钮相同的组[重复]

    这个问题在这里已经有答案了 我有 winform 应用程序 NET 4 0 有没有办法手动设置一组单选按钮 我有四个单选按钮 其中两个位于组框内 另外两个位于该框外 如何将它们全部设置为同一组 这可能已经在另一篇文章中得到了回答 听起来是一
  • 当输入字段处于焦点时,占位符不会消失

    当用户选择字段时 表单上每个输入字段的占位符值应该消失 但事实并非如此 文档类型是 HTML5 http dailyspiro com index html http dailyspiro com index html
  • 使用 Java 清理 CSS

    Java 中有没有一个好的库可以清理 CSS 样式表 我们希望允许管理员用户上传 CSS 样式表来控制他们管理的网站部分的外观 当然 我们不希望出现诸如background url javascript 之类的XSS攻击 因此我们正在寻找一
  • 如何在 leaflet.js 中设置 layer.control 的样式?

    我正在尝试更改图层控件中的默认下拉菜单图标 我希望图标旁边有文字 有什么办法可以做到这一点吗 也许使用 JQuery 和 CSS 我正在开发一个基于此示例的传单项目 http leafletjs com examples layers co
  • jQuery 更改事件未在输入元素上触发

    首先 我检查了与我的问题类似的每个主题 不幸的是 我还没有找到答案 我尝试结合一些答案 但没有成功 注 刚开始学习jQuery 所以这是我的问题 我创建了一个带有四个文本输入和一个按钮的表单 每个输入内部都有一个 svg 图标和一个占位符文
  • 如何将电子邮件类型的输入应用到 Asp.net MVC3 Razor 中的 HTML Helper

    如何将电子邮件类型的输入应用到 Asp net MVC3 Razor 中的 HTML Helper 例如
  • 弯曲方向等高行:列

    我有一个带有两个弹性项目的弹性布局 显示为行 flex direction column 这些物品应该有一个最小高度 但它们应该保持其中一个物品生长所需的相同高度 看这个 JSFiddle https jsfiddle net 958vxh
  • 使用 Javascript 从 CSS 文件中提取颜色

    我正在上传一个 css 文件 希望从中记录引用的每种颜色 所以如果 css 文件有 background color ffffff color 000000 我希望能够创建一个包含以下内容的列表 ffffff 000000 这样做的最好方法
  • 通过 SVG 背景传递鼠标事件

    我有两个 SVG 元素 每个元素覆盖整个屏幕 html body height 100 svg position absolute top 0 left 0 bottom 0 right 0
  • HTML 覆盖高度覆盖整个可见页面

    我有一个使用 AJAX 加载一些内容的网页 我想在加载过程中显示带有加载指示器的覆盖层 以便用户无法与页面的大部分内容交互 除了顶部的菜单 我正在使用 jQuery 和jQuery BlockUI 插件 http malsup com jq
  • Django css文件缓存

    我有一个 css 文件 我想修改它以满足我的需要 问题是它似乎被缓存在某个地方 因为无论我在 css 文件中做什么 我都看不到更改 我确信我指向了正确的文件 因为现在我已经对其进行了修改 并且它有效 有什么设置可以关闭缓存吗 谢谢 正如本文
  • 呈现为 Flexbox 的有序列表不显示项目符号/小数(项目也呈现为 Flexbox)

    我有一个有序列表 ol 有它的display属性设置为flex 列表项也呈现为弹性框 这样做会导致项目符号 数字 不再显示 有什么办法可以让项目符号显示在ol有课 questions questions likert 在40px的区域pad
  • Firefox:如何测试首选颜色方案?

    在 Firefox 67 中 可以使用媒体查询来检测用户对浅色或深色主题的偏好 https davidwalsh name demo prefers color scheme php 在我的 Firefox 版本 在 Ubuntu 下 中
  • 使用 jquery 提供附加功能时菜单未正确对齐

    I need to make a mega menu similar to one as show in image below 到目前为止 我已经能够在某种程度上使其发挥作用 例如jsFiddle 在这里 http jsfiddle ne

随机推荐

  • 使用数据帧减去字典中列表的值

    我下面有一个数据框 其中包含用户购买的产品 数据集 user age maritalstatus product A Young married 111 B young married 222 C young Single 111 D ol
  • exec() 命令不起作用

    我正在使用 exec 函数在 centos 服务器上运行我的命令 一切正常 直到我使用命令 命令 ffmpeg i 输入视频 mp4 vf fade out 0 5 输出 mp4 该命令正常 因为它通过命令行在服务器上运行 但是当我使用 p
  • Three.js 合并网格但保留单独的材质

    我正在开发一个基于网络服务器的可视化项目 我让它工作并查看我想要的方式 但它比我希望的要慢得多 基本上 它有一个巨大的网格来建模空间 然后各个立方体以不同的颜色显示在网格中 或者如果那里没有任何东西 则当前将其删除 但可以轻松地使用透明材料
  • Rails 4.0.0 - “没有将 nil 隐式转换为字符串”

    刚刚安装了一个全新的 Rails 4 0 0 应用程序 我收到此错误 https gist github com hartator 6404820 https gist github com hartator 6404820 on http
  • 转换 Html 并将文本设置为 Textview

    我正在尝试转换 html 字符串并将其设置为 TextView 但我无法准确执行此操作 这是我的字符串 您好 1 s 您有 2 d条新消息 我在用textview setText Html fromHtml myString 这会生成带有
  • Windows下如何知道复制是否完成?

    我正在编写一个监听位置的工具 最好是远程位置 如果创建了新的文件夹或文件 它会将其下载到本地位置 目前我正在监听远程文件夹FileSystemWatcher 当创建新文件夹 文件时 我启动一个计时器 如果计时器达到 X 分钟 它就会开始将其
  • UIAlertcontroller 作为 Swift 中的操作

    所以我希望弹出一个警报 告诉我一条消息 然后我希望它等待我 直到我按 确定 然后它将继续执行该功能 例如 IBAction Alert let alertController UIAlertController title title me
  • 在 Windows 上托管闪亮的应用程序

    首先我的问题与 如何在 Windows 服务器上托管 Shiny 应用程序 https stackoverflow com questions 46848995 how to host shiny apps on windows serve
  • nslog时间戳

    我想记录设备运动时间戳属性 设备运动位于 CMMotionManager devicemotion timestamp 类中 有任何想法吗 这是我提出的解决方案 因为日期是根据 Apple 文档确定的 时间戳是自电话启动以来的时间量 以秒为
  • 禁用文本选择 UITextView

    我想禁用 UITextView 上的文本选择 到现在为止我所拥有的 已经完成的是 BOOL canPerformAction SEL action withSender id sender UIMenuController sharedMe
  • 错误:boost/scoped_ptr.hpp:使用 libkml 时没有此类文件或目录

    我正在开发一个使用谷歌地图数据库的软件 我搜索了 google 发现一个 C 库可以做到这一点 libkml 我已经下载了一些示例代码website http code google com p libkml source browse t
  • Git Bash shell 无法创建符号链接

    当我尝试从以下位置创建符号链接时Git Bash https superuser com questions 1053633 what is git bash for windows anywayshell 每次都失败 ln s c Use
  • iOS – UILocalNotification 对同一个通知触发了两次

    如果我安排两个UILocalNotifications 并将它们设置为在完全相同的 fireDate 处触发 然后在设备上 这不是模拟器的bug 上的fireDateapplication didReceiveLocalNotificati
  • 无法更新 git 存储库:“sign_and_send_pubkey:不支持相互签名”

    我正在使用 git 存储库 并使用 ssh 密钥与其连接 直到今天都运行良好 我正在执行拉取操作 并收到以下 ssh 错误 sign and send pubkey no mutual signature supported 然后它会要求输
  • 为什么在 C++ 函数中可以返回对象引用?

    这是网站上的示例 http www cplusplus com doc tutorial classes2 http www cplusplus com doc tutorial classes2 我知道这是一个有效的例子 但是 我不明白为
  • 对于无法到达的目的地,ICMP 回显请求/回复的正确流程是什么?

    Goal 我需要能够 ping 网络交换机以确定它是否可用 这是为了告诉用户网络电缆已拔出 网络交换机不可用或网络通信路径中存在其他问题 我意识到这不是一个全面的诊断工具 但有总比没有好 Design 我计划使用带有原始套接字的 ICMP
  • 使用 HttpWebRequest 传输大文件时出现内存不足异常

    使用大文件的 Http Put 时出现内存不足异常 我正在使用异步模型 如代码所示 我正在尝试将 8K 数据块发送到 Windows 2008 R2 服务器 当我尝试写入超过 536 868 864 字节的数据块时 始终会发生异常 异常发生
  • 神经网络:输入层由神经元组成吗?

    我目前正在研究神经网络理论 我发现到处都写到它由以下几层组成 输入层 隐藏层 输出层 我看到一些图形描述将输入层显示为网络中的真实节点 而其他图形描述则将该层显示为值向量 x1 x2 xn 什么是正确的结构 输入层 是真正的神经元层吗 或者
  • 如何在 VS Code 终端中突出显示要复制和粘贴的文本?

    如何创建突出显示终端文本的快捷方式 Ctrl Shift 右 左 Ctrl Shift End Ctrl Shift Home 正如在 PowerShell ISE 中实现的那样 如何创建按单词移动光标的快捷方式 Ctrl 右 左 类似于
  • 单选按钮样式

    我想用纯 CSS 设计单选按钮的样式 没有类或 ID 只需输入 type radio 我想对未选择和选择使用背景图像 然而 vendor appearance none 不适用于 Trident 或 Gecko 只是Webkit 在这些浏览