我的意思是,单选按钮本身由一个圆形和中心的一个点组成(当按钮被选中时)。我想改变的是两者的颜色。使用CSS可以做到这一点吗?
当前回答
为了创建额外的元素,我们可以使用:after,:before(所以我们不需要对HTML进行太多的更改)。对于单选按钮和复选框,我们可以使用:checked。我们还可以使用其他一些伪元素(例如:hover)。使用这些组合,我们可以创建一些非常酷的自定义表单。检查这个
其他回答
你可以使用CSS的重音颜色属性来改变颜色。
input[type='radio'] {
accent-color: #232323;
}
它适用于Chrome/Edge 93+, Firefox 92+和Safari 15.4+(浏览器支持信息来自caniuse。)
简单来说,可以用重音色
查看页面来源
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
input[type=radio] {
accent-color: red;
}
</style>
</head>
<body>
<label for="css">Are you like to css</label>
<input type="radio" id="css" value="css">
</body>
</html>
这对我很有效,
简单添加css属性:
输入(type = "电台"]{强调色:红色;}
这里是资源链接
单选按钮是特定于每个操作系统/浏览器的原生元素。没有办法改变它的颜色/风格,除非你想实现自定义图像或使用自定义Javascript库,其中包括图像(例如这个-缓存链接)
这在本地CSS中是不可能的。您必须使用背景图像和一些javascript技巧。
推荐文章
- 在notepad++中格式化代码
- 表单中包含表单,可以吗?
- 如何创建表只使用<div>标签和Css
- html5 - canvas元素-多层
- 如何确保<select>表单字段被禁用时提交?
- 如何在HTML文本换行?
- 如何在JavaScript中转义单引号(')?
- Chrome开发工具:如何找出什么是覆盖CSS规则?
- 如何使用HTML/CSS在文本中插入空格/制表符
- 用背景图像填充SVG路径元素
- 将JSON显示为HTML
- HTML被认为是一种编程语言吗?
- 如何修复favicon.ico错误:“Failed to load resource: net::ERR_EMPTY_RESPONSE”
- 大Glyphicons
- 这个CSS是如何产生一个圆的?