博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
ie浏览器不支持select option italic
阅读量:7034 次
发布时间:2019-06-28

本文共 1874 字,大约阅读时间需要 6 分钟。

hot3.png

由于项目需要,要实现select option斜体样式:

<option style="font-style:italic;" value="1">1</option>

发现在ie8下根本不支持,chrom下可以。

后来查阅资料发现:

170322_QDNc_2353726.png

好吧,如果ie下非要select option 非要实现样式斜体,可以使用div+css方式模拟select:

body,ul,li{ margin:0; padding:0; font-size:13px;}ul,li{list-style:none;}.divselect{width:52px; margin:80px auto; position:relative; z-index:10000;}.divselect cite{ height:24px;line-height:24px; display:block; cursor:pointer;font-style:normal;padding-left:4px; padding-right:30px; border:1px solid #333333; background:url(xjt.png) no-repeat right center;}.divselect ul{width:50px;border:1px solid #333333; background-color:#ffffff; position:absolute; z-index:20000; margin-top:-1px; display:none;}.divselect ul li{height:24px; line-height:24px;}.divselect ul li a{display:block; height:24px; color:#333333; text-decoration:none; padding-left:10px; padding-right:10px;}.divselect ul li a:hover{background-color:#CCC;}
jQuery.divselect = function(divselectid,inputselectid) { var inputselect = $(inputselectid); $(divselectid+" cite").click(function(){ var ul = $(divselectid+" ul"); if(ul.css("display")=="none"){ ul.slideDown("fast"); }else{ ul.slideUp("fast"); } }); $(divselectid+" ul li a").click(function(){ var txt = $(this).text(); $(divselectid+" cite").html(txt); $(divselectid+" cite").attr("style",$(this).attr("style")); $(divselectid+" cite").css("background-color","#CCC"); $(divselectid+" cite").focus(); var value = $(this).attr("selectid"); inputselect.val(value); $(divselectid+" ul").hide(); window.event.cancelBubble = true; }); $(document).click(function(){ $(divselectid+" ul").hide(); $(divselectid+" cite").css("background-color",""); });};$(function(){ $.divselect("#selectid","#inputid"); });
  
      
      
             
  •          
  • Y
  •          
  • N
  •          
  • NA
  •                
  

效果就自己试吧,不截图了。

转载于:https://my.oschina.net/u/2353726/blog/536066

你可能感兴趣的文章
mysql中int、bigint、smallint 和 tinyint的区别详细介绍
查看>>
Windows活动目录系列---配置AD域服务的信任(2)
查看>>
Indirect以及sumifs函数+多重合并数据透视表
查看>>
与外包人员合作时,如何管理代码?
查看>>
忘记windows12密码修复
查看>>
RAC安装与配置
查看>>
我的友情链接
查看>>
分布式一致性,技术选型之路
查看>>
简单方便的表单验证
查看>>
Linux中用户管理
查看>>
CVS 中文手册
查看>>
debugger markup language帮助文档(DML)
查看>>
Eric S. Raymond五部曲
查看>>
微软开源项目
查看>>
06实施过程指南
查看>>
CentOS 7.2使用yum安装MYSQL 5.7.10
查看>>
关于HTTP请求GET和POST的简单说明
查看>>
log4j2 使用详解
查看>>
SSH配置远程登录到服务器
查看>>
公司机房设备迁移更概
查看>>