用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显示隐藏一个div特效的具体实现
Feb 10 HTML / CSS
详解CSS3选择器:nth-child和:nth-of-type之间的差异
Sep 18 HTML / CSS
CSS3实现王者荣耀匹配人员加载页面的方法
Apr 16 HTML / CSS
css3实现文字首尾衔接跑马灯的示例代码
Oct 16 HTML / CSS
HTML+CSS3+JS 实现的下拉菜单
Nov 25 HTML / CSS
html5的自定义data-*属性与jquery的data()方法的使用
Jul 02 HTML / CSS
HTML5 Canvas玩转酷炫大波浪进度图效果实例(附demo)
Dec 14 HTML / CSS
详解canvas多边形(蜘蛛图)的画法示例
Jan 29 HTML / CSS
详解Canvas实用库Fabric.js使用手册
Jan 07 HTML / CSS
AmazeUI框架搭建的方法步骤(图文)
Aug 17 HTML / CSS
css3带你实现3D转换效果
Feb 24 HTML / CSS
新的CSS 伪类函数 :is() 和 :where()示例详解
Aug 05 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
PHP 事件机制(2)
2011/03/23 PHP
php中时间轴开发(刚刚、5分钟前、昨天10:23等)
2011/10/03 PHP
PHP中strtotime函数使用方法分享
2012/01/10 PHP
PHP中的gzcompress、gzdeflate、gzencode函数详解
2014/07/29 PHP
页面利用渐进式JPEG来提升用户体验度
2014/12/01 PHP
PHP实现的XML操作类【XML Library】
2016/12/29 PHP
PHP实现的多维数组排序算法分析
2018/02/10 PHP
浅谈PHP之ThinkPHP框架使用详解
2020/07/21 PHP
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
2008/11/24 Javascript
nodejs的require模块(文件模块/核心模块)及路径介绍
2013/01/14 NodeJs
nodejs文件操作模块FS(File System)常用函数简明总结
2014/06/05 NodeJs
jquery实现仿新浪微博评论滚动效果
2015/08/06 Javascript
js带点自动图片轮播幻灯片特效代码分享
2015/09/07 Javascript
浅谈JavaScript异步编程
2017/01/20 Javascript
ng-options和ng-checked在表单中的高级运用(推荐)
2017/01/21 Javascript
微信小程序中form 表单提交和取值实例详解
2017/04/20 Javascript
JavaScript仿微信(电话)联系人列表滑动字母索引实例讲解(推荐)
2017/08/16 Javascript
Vue.js 中取得后台原生HTML字符串 原样显示问题的解决方法
2018/06/10 Javascript
详解Angular5/Angular6项目如何添加热更新(HMR)功能
2018/10/10 Javascript
python实现探测socket和web服务示例
2014/03/28 Python
Python简单获取网卡名称及其IP地址的方法【基于psutil模块】
2018/05/24 Python
python requests 库请求带有文件参数的接口实例
2019/01/03 Python
python实现矩阵打印
2019/03/02 Python
Flask框架模板继承实现方法分析
2019/07/31 Python
Django重设Admin密码过程解析
2020/02/10 Python
Pycharm修改python路径过程图解
2020/05/22 Python
Python如何爬取b站热门视频并导入Excel
2020/08/10 Python
Python中正则表达式对单个字符,多个字符和匹配边界等使用
2021/01/27 Python
使用CSS3的appearance属性改变任何元素的浏览器默认风格
2012/12/24 HTML / CSS
C语言基础笔试题
2013/04/27 面试题
运动会邀请函范文
2014/01/31 职场文书
2014年9.18纪念日演讲稿
2014/09/14 职场文书
超市仓管员岗位职责范本
2014/09/18 职场文书
家庭贫困证明
2014/09/23 职场文书
工程合作意向书范本
2015/05/09 职场文书
《平移和旋转》教学反思
2016/02/19 职场文书