HTML中input提示文字样式可以改吗
Admin 2022-07-05 群英技术资讯 638 次浏览
在很多网站上我们都看到input输入框显示提示文字,让我们一起来看看如果在input输入框中显示提示文字。我们只需要在<input>标签里添加:placeholder="提示文字即可",那么如果要修改提示文字的样式呢?可以这样设置css样式:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>input输入框提示文字</title> <style> /*修改提示文字的颜色*/ input::-webkit-input-placeholder { /* WebKit browsers */ color: red; } input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: red; } input::-moz-placeholder { /* Mozilla Firefox 19+ */ color: red; } input:-ms-input-placeholder { /* Internet Explorer 10+ */ color: red; } </style> </head> <body> <input type="text" placeholder="请输入用户名" /> </body> </html>
修改后提示文字样式如下:
PS:下面看下HTML5里的input标签的required属性提示文字修改
在做表单提交时我们有时会遇到这样的需求,在用户没有输入必填信息点提交时提示文字需要改为我们想要的提示信息,那么可以在input里面增加这样的语句:
<input type="text" placeholder="您的姓名" required oninvalid="setCustomValidity('请输入您的姓名');" oninput="setCustomValidity('');" />
到此这篇关于html中input提示文字样式修改的文章就介绍到这了,更多相关html input 文字样式内容请搜索脚本之家以前的文章或继续浏览下面的相关文章,希望大家以后多多支持脚本之家!
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。
猜你喜欢
使用table标签进行布局,主要还是使用了vertical-align属性和text-align属性。但是相对于上一种方式,使用table标签会产生大量的冗余代码。不推荐使用
这篇文章主要介绍了详解如何使用rem或viewport进行移动端适配,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
css降低背景透明度方法1:使用opacity属性Opacity属性设置一个元素了透明度级别。从0.0(完全透明)到1.0(完全不透明)<!DOCTYPE html><html><head><meta charset="UTF-8"><style ty
这篇文章主要介绍了用CSS3和table标签实现一个圆形轨迹的动画的示例代码,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
我们通常设置的宽度和高度,是指盒子模型中内容(content)的宽度和高度。元素的高度,还要加上上下padding和上下border,元素整个盒子的高度还要加上上下margin;宽度类似计算。注意:父子元素包含情况下的计算,父亲元素会把儿子元素的整个盒子(包括margin)的大小作为内容。外边距塌陷(margincollapse),块元素的top与bottom外边距有时
成为群英会员,开启智能安全云计算之旅
立即注册Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所有
增值电信经营许可证 : B1.B2-20140078 粤ICP备09006778号 域名注册商资质 粤 D3.1-20240008