重庆时时彩开奖号码:重庆时时彩开奖记录

关闭

核弹头小游戏

游戏轻松点
无需下载,点开即玩

拿起手机!扫我啊

核弹头小游戏
无需下载点击即玩

回到顶部

当前位置: 重庆时时彩开奖记录 > 游戏教程 > 正文

html5输入框提示文字怎么实现

重庆时时彩开奖记录 www.iogb5.com.cn 来源:重庆时时彩开奖记录 www.iogb5.com.cn    作者:集   时间:2016-04-27

如何让input输入框背景有文字提示效果呢?本文小编为你带来详细解析。

这种效果现在网上非常的普遍流行,但大部分是使用JavaScript实现的。但HTML5给我们提供了新的纯HTML的实现方式,不需要任何的JavaScript,只需要在你的input文本框的标记上添加HTML5规范里新增的placeholder属性,然后在属性值里输入你需要的提示信息。

语法基本是这个样子:input placeholder=”提示信息...”

HTML代码

<form>
<input type="text" placeholder="你的姓名..." name="lname">
<input type="password" placeholder="你的密码..." name="pass">
<input type="submit" value="提交">
</form>

用CSS美化Placeholder提示信息的样式

CSS3里有相应的通用的对Placeholder提示信息美化的方法。你可以设置提示信息文字的颜色,透明度,背景色等。

为了最大化的兼容所有浏览器,给CSS里的placeholder属性添加浏览器引擎前缀还是有必要的。

- 谷歌浏览器(Webkit): ::-webkit-input-placeholder pseudo-element;

- IE10: :-ms-input-placeholder pseudo-class;

- 火狐浏览器(Gecko18-): :-moz-placeholder pseudo-class;

- 火狐浏览器(Gecko19+): ::-moz-placeholder pseudo-element;

- Opera(Presto): 无。

/* WebKit browsers */
::-webkit-input-placeholder {
color: #777;
}
/* Mozilla Firefox 4 to 18 */
:-moz-placeholder {
color: #777;
opacity: 1;
}
/* Mozilla Firefox 19+ */
::-moz-placeholder {
color: #777;
opacity: 1;
}
/* Internet Explorer 10+ */
:-ms-input-placeholder {
color: #777;
}

对Placeholder的浏览器支持情况

各种浏览器对HTML5/CSS3里出现的新特征、新属性的支持是逐步提高的,最终所有的浏览器都会完全支持HTML5/CSS3,这是毫无疑问的。目前,对HTML5的placeholder属性支持的浏览器有谷歌浏览器、火狐浏览器、Safari、Opera,还有IE10+。

核弹头小游戏网发布此文仅为传递信息,不代表认同其观点或者证实其描述!
  • 国家市场监管总局:改革调整强制性产品认证目录及实施方式 2018-11-14
  • 《向往的生活》蘑菇屋F4秒变土味F4引爆笑 黄磊扮演"道明磊" 2018-11-14
  • 做奋斗者  做实干家 2018-11-13
  • 韩国提东亚四国联合申办世界杯,中国足协:并无计划 2018-11-12
  • 世界杯揭幕战打响 现场球迷抢眼 2018-11-12
  • 紫光阁中共中央国家机关工作委员会 2018-11-11
  • 法制日报:打赏制别损害消费者权益 2018-11-11
  • 3秒过闸!白云机场2号航站楼坐大巴可“刷脸”检票 2018-11-10
  • OPPO Find X:曲面全景屏,史无前例的屏占比 2018-11-10
  • 温岭:有轨电动车开进葡萄园 2018-11-09
  • 国际锐评:美方反复无常,中方洞若观火,同等反制! 2018-11-08
  • 新疆兵团第六师骨干教师赴墨玉县乡镇中心学校开展送教活动 2018-11-07
  • 没考上?没关系。其它学校也能培养建设国家的人才,清华只是名气大点。 2018-11-06
  • 熊孩子不小心把弟弟锁进快递柜 消防5分钟破拆 2018-11-06
  • 黄河口,大美之诗文章中国国家地理网 2018-11-05
  • 903| 656| 233| 168| 353| 452| 890| 773| 114| 778|