css怎么设置input颜色

css设置input颜色的方法:首先新建html文件,并在body标签中输入一个input标签;然后在head标签和body标签之间添加样式标签style;最后在style标签中输入“#demo{backgroung:red;}”即可。

css怎么设置input颜色

本文操作环境:windows7系统、HTML5&&CSS3版、Dell G3电脑。

如何设置input 的背景颜色

可以用input的css中background属性设置。

新建html文件,在body标签中,输入一个input标签,用浏览器打开这个文件,可以发现input标签的默认背景色是白色:

立即学习“前端免费学习笔记(深入)”;

c45f094b406e51c6ae86e45ba52b17e.png

为了防止当前input背景色和其他input标签冲突,我们可以给当前input设置唯一id,这里用“demo”为例:

84a4afbe8f7b1f90765664e7ececddb.png

在head标签和body标签之间添加样式标签style,在style标签中,输入‘#demo {backgroung : red; }’,这里以红色背景色为例,此时浏览器中的input标签背景颜色变成了红色:

c16979de9cc6892d91ce97f4ecb1bf3.png

除了用css设置input的背景颜色,还可以用JavaScript动态设置input背景颜色。在body标签和html标签之间添加script标签,先获取元素的id,再获取背景颜色属性。如图所示,在script标签中输入“document.getElementById(‘demo’).style.background = ‘pink’;”,这里以粉色为例,此时浏览器中的input标签背景颜色变成了粉色;

a54d648d68afa9781e7a1813fb0ff8b.png

【推荐学习:css视频教程】

以上就是css怎么设置input颜色的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2952495.html

(0)
上一篇 2025年3月11日 23:47:09
下一篇 2025年2月18日 03:50:16

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • css怎么设置表格线

    css设置表格线的方法:首先新建一个html文件;然后使用table标签创建一个两行两列的表格;接着设置table表格的id为testable;最后使用border属性设置表格线为1px的红色线即可。 本文操作环境:windows7系统、H…

    2025年3月11日 编程技术
    200
  • css怎么改变边框颜色

    在css中可以通过border-color属性设置四条边框的颜色,此属性可设置1到4种颜色,其使用语法如“border-color:red green blue pink;”;该属性是一个简写属性,可设置一个元素的所有边框中可见部分的颜色。…

    2025年3月11日
    200
  • css定位有哪些

    css定位有:1、static,表示静态定位;2、relative,表示相对定位;3、absolute,表示绝对定位;4、fixed,表示固定定位。 本文操作环境:windows7系统、HTML5&&CSS3版、Dell G…

    2025年3月11日
    200
  • css important什么意思

    css中important是用于提高指定样式规则的应用优先权的一种语法,其语法格式如“{sRule!important}”;而优先级高的css样式会覆盖优先级低的样式。 本文操作环境:windows7系统、HTML5&&CS…

    2025年3月11日
    200
  • css怎么设置下划线

    css设置下划线的方法:首先创建一个HTML示例文件;然后在body中定义一些文字内容;最后通过“text-decoration:underline;”样式为文本添加下划线即可。 本文操作环境:windows7系统、HTML5&&a…

    2025年3月11日
    200
  • css top不起作用怎么办

    css top不起作用是因为“position”属性的值为“static”,那么设置“top”属性就不会产生任何效果,其解决办法就是确保position属性的值为absolute或者relative即可。 本文操作环境:windows7系统…

    2025年3月11日
    200
  • css怎么去掉a标签的颜色

    css去掉a标签的颜色的方法:首先打开相应的代码文件;然后找到a标签内容;最后通过“-webkit-user-select: none;”等属性取消a标签在移动端点击时的蓝色即可。 本文操作环境:windows7系统、HTML5&&…

    2025年3月11日
    200
  • css怎么旋转图片

    css旋转图片的方法:首先创建一个HTML示例文件;然后在body中创建一个div;最后通过使用css3的transform属性对元素进行旋转、缩放、移动或倾斜即可。 本文操作环境:windows7系统、HTML5&&CSS…

    2025年3月11日
    200
  • css怎么让文字居中

    css让文字居中的方法:首先创建一个HTML示例文件;然后在body中定义一些文字内容;最后通过“text-align”或“line-height”属性实现文字水平或垂直方向居中即可。 本文操作环境:windows7系统、HTML5&amp…

    2025年3月11日 编程技术
    200
  • css如何画线

    css画线的方法:1、使用border属性实现画一条线的效果,代码如“border-bottom: 1px solid #000000;”;2、使用hr标签实现画一条线效果。 本文操作环境:windows7系统、HTML5&&amp…

    2025年3月11日
    200

发表回复

登录后才能评论