用CSS禁用输入法(CSS3 UI规范)实例解析


Posted in HTML / CSS onDecember 04, 2012

禁用输入法属性ime-mode是CSS3中最新添加的属性,更准确点说,是CSS Basic User Interface Module Level 3 (CSS3 UI)规范新添加的属性。但是IE浏览器从IE5开始就支持该属性,FireFox浏览器从FireFox3.0开始也支持该ime-mode属性。不过chrome、opera、Safari浏览器还没有开始支持该属性。该属性可以控制文本字段的输入法编辑器的状态:

名称: ime-mode
值: auto | normal | active | inactive | disabled | inherit
初始值: auto
应用元素: text fields(文本字段)
继承性: no

auto : 默认值,不影响当前输入法编辑器的状态
normal : 输入法编辑器的状态应该是normal,这个值可以用于用户样式表来覆盖页面的设置。IE浏览器不支持该属性
active : 输入法编辑器的状态初始时是激活的;输入将一直使用该输入法直到用户切换输入法。该属性在Linux操作系统下不支持
inactive : 输入法编辑器的状态初始时是非激活状态;除非用户激活输入法
disabled : 禁用输入法编辑器;该输入法编辑器也许不会被用户激活
实例
复制代码
代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title> New Document </title>
<style type="text/css">
input {ime-mode: disabled; }
</style>
</head>
<body>
<form name="form1" method="post" action="">
<input type="text" name="textfield">
</form>
</body>
</html>

上面的例子在IE5+或者FireFox3+浏览器中运行,不允许输入中文。
这个属性虽然很强大,但是在最新版的chrome、opera、safari浏览器中都不支持该属性,所以在这些浏览器中还需要通过JavaScript来实现当用户输入中文时无法输入到文本框中。
HTML / CSS 相关文章推荐
CSS3五个技巧给你的网站带来出色的效果
Apr 02 HTML / CSS
关于css兼容性问题及一些常见问题汇总
May 03 HTML / CSS
你不知道的5个HTML5新功能
Jun 28 HTML / CSS
HTML5 语音搜索只需一句代码
Jan 03 HTML / CSS
html5 拖拽上传图片实例演示
Apr 01 HTML / CSS
Canvas globalCompositeOperation
Dec 18 HTML / CSS
Canvas 文本填充线性渐变的使用详解
Jun 22 HTML / CSS
前后端结合实现amazeUI分页效果
Aug 21 HTML / CSS
HTML+CSS制作心跳特效的实现
May 26 HTML / CSS
html2 canvas svg不能识别的解决方案
Jun 03 HTML / CSS
CSS的calc函数用法小结
Jun 25 HTML / CSS
使用CSS定位HTML元素的实现方法
Jul 07 HTML / CSS
html5 css3 动态气泡按钮实例演示
Dec 02 #HTML / CSS
IE矩阵Matrix滤镜旋转与缩放及如何结合transform
Nov 29 #HTML / CSS
CSS3悬停效果案例应用
Nov 21 #HTML / CSS
在css3中background-clip属性与background-origin属性的用法介绍
Nov 13 #HTML / CSS
CSS3基础(RGBa、text-shadow、box-shadow、border-radius)
Nov 13 #HTML / CSS
css3绘制天猫logo实现代码
Nov 06 #HTML / CSS
CSS3实现DIV圆角效果完整代码
Oct 10 #HTML / CSS
You might like
详细介绍:Apache+PHP+MySQL配置攻略
2006/09/05 PHP
PHP几个数学计算的内部函数学习整理
2011/08/06 PHP
Php Ctemplate引擎开发相关内容
2012/03/03 PHP
php生成缩略图示例代码分享(使用gd库实现)
2014/01/20 PHP
图片之间的切换
2006/06/26 Javascript
jQuery checkbox全选/取消全选实现代码
2009/11/14 Javascript
js+html+css实现鼠标移动div实例
2013/01/30 Javascript
js动态创建、删除表格示例代码
2013/08/07 Javascript
IE网页js语法错误2行字符1、FF中正常的解决方法
2013/09/09 Javascript
Node.js开发指南中的简单实例(mysql版)
2013/09/17 Javascript
基于jQuery实现在线选座之高铁版
2015/08/24 Javascript
jQuery qrcode生成二维码的方法
2016/04/03 Javascript
实现隔行换色效果的两种方式【实用】
2016/11/27 Javascript
angularjs中ng-bind-html的用法总结
2017/05/23 Javascript
es6 字符串String的扩展(实例讲解)
2017/08/03 Javascript
jQuery中.attr()和.data()的区别分析
2017/09/03 jQuery
Vue拖拽组件开发实例详解
2018/05/11 Javascript
微信小程序踩坑记录之解决tabBar.list[3].selectedIconPath大小超过40kb
2018/07/04 Javascript
Vuejs监听vuex中值的变化的方法示例
2018/12/02 Javascript
webpack中如何加载静态文件的方法步骤
2019/05/18 Javascript
JS如何把字符串转换成json
2020/02/21 Javascript
Vue发布订阅模式实现过程图解
2020/04/30 Javascript
Javascript confirm多种使用方法解析
2020/09/25 Javascript
解决python报错MemoryError的问题
2018/06/26 Python
Python实现的简单读写csv文件操作示例
2018/07/12 Python
Python统计纯文本文件中英文单词出现个数的方法总结【测试可用】
2018/07/25 Python
python pygame实现2048游戏
2018/11/20 Python
pytorch .detach() .detach_() 和 .data用于切断反向传播的实现
2019/12/27 Python
python实现简单飞行棋
2020/02/06 Python
解决tensorboard多个events文件显示紊乱的问题
2020/02/15 Python
手把手教你从PyCharm安装到激活(最新激活码),亲测有效可激活至2089年
2020/11/25 Python
世界上最大的隐形眼镜商店:1-800 Contacts
2018/11/03 全球购物
餐厅销售主管职责范本
2014/02/19 职场文书
2014年大班元旦活动方案
2014/02/26 职场文书
2014年关工委工作总结
2014/11/17 职场文书
少先队辅导员事迹材料
2014/12/24 职场文书