利用CSS控制SELECT中的OPTION是否不允许选

最新推荐文章于 2024-06-17 11:23:01 发布
最新推荐文章于 2024-06-17 11:23:01 发布
阅读量1k 收藏
点赞数
分类专栏： CSS 文章标签： css firefox class html ie
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jujuchen/article/details/1675658
版权

<html>
<head>
<style type="text/css">
.disabled {
}
.disabled optgroup{
font-size: 12px;
font-style: normal;
font-weight: normal;
font-variant: normal;
color:#CCCCCC;
background-color: #F5F5F5;
}
.disabled option {
padding-left:0px;
}
</style>
<title></title>
</head>
<body>
<select name="carCos" class="disabled">
<optgroup label="American"></optgroup>
<option value="General Motors">General Motors</option>
<option value="Ford">Ford Motor Company</option>
<option value="Chrysler">DaimlerChrysler</option>
<optgroup label="Japanese"> </optgroup>
</select>
 
用这种变态的方式可以实现，在firefox和ie6下看效果很好
</body>
</html> 

jujuchen
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
「HTML和CSS入门指南」option 标签详解
a451319296的博客
06-04 4976
option 标签是一个重要的标签，在 HTML 中用于创建下拉列表中的选项。使用 option 标签可以帮助您定义和呈现下拉列表中的各个选项。在使用 option 标签时，请注意选择正确的属性和方法、提供适当的标签、描述文本和无障碍功能、验证表单数据，并避免大量选项问题。
html option禁用选择 select禁用选项示例
12-14
复制代码代码如下: <select> <option value=””>1</option> <option value=””>2</option> <option value=””>3</option> <option value=””>4</option> <option value=””>5</option> </select>   我不想让用户可以选择 345 怎么办呢 复制代码代码如下: <select> <option value=””>1</option> <option value=””>2</option> <optgroup label=”3″></optgroup>
前端css select、option禁用
qq_45094682的博客
03-10 1870
前端禁用select、option，看图说话 1.直接使用disabled在option 上禁用就可以了 <div class="rig_ipt200 "> <div class=" g-select " style="border-radius: 5px;width: 200px;border: none;"> <input type="text" value="待联系" disabled class="ipt select_img"> <select
select 下拉框不可选
最新发布
csdn565973850的博客
06-17 608
select下拉框设置不可选
html option禁用 select禁用选项
小c
04-11 2955
select 下面有很多option 比如
JS中select框中控制下拉列表部分可选部分不可选
LM891108647的博客
01-10 5659
最近在业务需求开发中，需要对结汇资金属性的下拉选项进行控制。需求原本是要求对于不可选的属性，用户点击后默认显示请选择。修改完成后，需求又变更为还是让属性显示出来，另外在别的地方去控制流程终止。哎，对业务的需求变更是最无力吐槽了，。最疯狂的遇到过，对于一个需求一天变一次，连续改了三个版本，真是累死宝宝了。 现在给大家提供最初的需求，不可选的属性置灰，用户点击后默认回到请选择的属性。 先把html
css option,选择选项Css(Select Option Css)
weixin_29476755的博客
08-04 4414
选择选项Css(Select Option Css)我有一个简单的下拉选择选项 - 下面的例子VolvoSaabMercedesAudi当鼠标悬停在沃尔沃上方时会弹出一种类型的工具提示 - 但希望它更大并且看起来更快。有没有解决方案 - 也许是CSS。I have a simple dropdown select option - example belowVolvoSaabMercedesAud...
利用浮层使select不可选的实现方法
09-01
总结来说，利用浮层使`<select>`元素不可选是一种实用的前端技巧，尤其适用于那些只需要视觉上禁用`<select>`而不需要完全禁用其功能的情况。然而，它也有一些限制，需要开发者根据具体项目需求和目标浏览器范围进行...
纯Css更改Select下拉框样式
03-04
纯Css更改Select下拉框样式，显示框的样式更改，下拉列表的样式更改！纯干货，肯定是你需要的 纯Css更改Select下拉框样式，显示框的样式更改，下拉列表的样式更改！纯干货，肯定是你需要的 纯Css更改Select下拉框...
select option带自定义图片
09-19
然而，原生的`<option>`元素并不支持直接添加图片，但通过一些JavaScript和CSS的技巧，我们可以实现自定义带有图片的`<option>`效果。以下是一个关于如何在`<select>`和`<option>`中添加自定义图片的详细教程。 ...
固定宽度下拉列表select中option内容显示不全问题解决方法
03-17
然而，在某些情况下，特别是在固定宽度的`<select>`元素中，如果`<option>`的内容过长，可能会导致内容显示不全，只显示部分内容或者超出边界。这种问题会给用户带来不便，因为他们可能无法清楚地看到所有可选项。...
css 原生 select ＞ option 样式无法修改问题
jiangjunyuan168的博客
01-10 1794
作者在维护老项目的过程中遇到一个修改原生 select 样式的需求，本以为只是一个简单的样式修改，但尝试过后，发现 select 下的 option 除了颜色样式可以修改，其他的样式怎么也修改不了。
css3 选择器
weixin_49346755的博客
10-01 737
CSS（层叠样式表）选择器是CSS规则的一部分，用来指定需要设置样式的HTML元素。是元素和其他部分组合起来告诉浏览器哪个 HTML 元素应当是被选为应用规则中的 CSS 属性值的方式。选择器所选择的元素，叫做“选择器的对象”。通过选择器可以实现CSS对HTML元素的一对一、一对多、多对一的控制。CSS选择器主要分为三类，第一类是基础选择器，这又包括通配选择器、标签选择器、ID选择器、CLASS选择器、属性选择器以及组合选择器；第二类是伪类选择器；最后一类是伪元素选择器。
css选择器option,css如何使用:indeterminate选择器
weixin_32090653的博客
08-04 735
本篇文章给大家介绍一下在css中:indeterminate选择器有什么用，可以在哪些元素中使用。下面我们就来看具体的内容。:indeterminate选择器简单介绍:indeterminate是一个CSS 伪类选择器，是用于选择处于不确定状态的用户界面元素的。例如，radio和checkbox元素可以在选中状态和未选中状态之间切换，但有时处于不确定状态，既不选中也不取消选中。类似地，还有HTML...
CSS的基础属性
Pikachu_999的博客
09-15 455
css的基础属性
CSS基础知识介绍——表单样式
qq_37196494的博客
08-04 536
表单基础元素 表单元素说明表 元素名 元素作用 input 文本输入框 textarea 可以容纳多行输入的文本输入框 select 下拉菜单 1.输入域标签——input:主要收集用户的信息 <form> <input type="filed_name" name="type_name"> &...
css基本语法
qq_52050261的博客
11-29 569
css基本语法
css select 禁止下拉选择
Ming-code
01-08 1616
style="pointer-events: none;"
你可能还不知的 7 个 CSS 好用的属性
粉丝们务必加入微信粉丝群
04-28 685
学习CSS是构建好看网页的一种方式。但是，在学习过程中，我们倾向于（大部分时间）限制自己，一遍又一遍地使用相同的属性。毕竟，我们是一种习惯性的动物，我们会使用自己习惯且熟悉的东西。因此，...
css中select选中option背景色
08-18
在CSS中，我们可以使用pseudo-class来改变选中option的背景颜色。首先，我们需要使用select元素选择器来选择select元素，然后使用option元素选择器来选择option元素。接下来，使用:active伪类来为选中的option添加样式。 例如，我们可以使用以下CSS代码来为选中的option设置背景颜色为红色： ``` select option:active { background-color: red; } ``` 此外，我们还可以使用其他伪类来进一步自定义选中option的样式。例如，使用:hover伪类为鼠标悬停在option上时设置背景颜色： ``` select option:hover { background-color: yellow; } ``` 需要注意的是，不同浏览器对于select元素的样式支持可能有所不同。有些浏览器可能不支持对选中option的背景色进行自定义设置，或者自定义设置的效果可能有所不同。因此，在使用这种方法时，建议在多个浏览器上进行测试以确保所需效果的一致性。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值