css3input在webkit上不生效。

最新推荐文章于 2022-04-27 01:08:21 发布
最新推荐文章于 2022-04-27 01:08:21 发布
阅读量1.2k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/shuawanxiao/article/details/45000425
版权

在input上添加css3属性：


  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */

  /* No support for these yet, use at own risk */
  -o-user-select: none;
  user-select: none;         

不能选中input输入。。。


澄清寰宇
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
CSS3 重置iphone浏览器按钮input,select等表单元素的默认样式
09-25
总之，理解和正确使用`-webkit-appearance`是解决CSS3在不同设备和浏览器上样式不一致问题的关键。在开发过程中，要时刻关注跨平台和跨设备的兼容性，确保用户在任何环境下都能获得一致的视觉体验。
CSS 针对谷歌浏览器(Chrome) safari的webkit核心浏览器CSS hack.txt )
09-04
上述代码中，`:input-placeholder`是一个伪元素，加上`-webkit-`前缀后仅在WebKit浏览器中生效。 3. **伪元素前缀**： - 使用`-webkit-`前缀结合伪元素来实现WebKit Hack。 - 例如： ```css .class-name::...
textarea[class='content']::-webkit-input-placeholder，css不生效原因
baiyikai的博客
03-23 907
一定要分开写，用逗号分隔会失效 textarea[class='content']::-webkit-input-placeholder { color: #E1E1E1; } textarea[class='content']:-moz-placeholder { color: #E1E1E1; } textarea[class='content']::-moz-placeh...
-webkit-user-select: none;导致的移动端input=text 无法输入
GUK
11-08 1874
解决办法： * { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: transparent; outline: none; } *:not(input,textarea)...
关于 设置 placeholder 无效解决办法
weixin_44378370的博客
07-13 2882
一、设置placeholder的方法 placeholder属性用来设置控件内部的提示信息 　　 改变placeholder的样式： input::placeholder { color: red; font-size: 22px; } 二、各浏览器样式兼容设置 1、针对谷歌浏览器的设置方式： input::-webkit-input-placeholder { color: red; font-size: 22px; } 2、针对火狐浏览器的设置方式： input::-moz-placeholder {
修改HTML5 input placeholder 颜色及修改失效的解决办法
在北风吹起的时候加入我们的队伍 在秋雨到来的时候成为彼此的温暖
11-02 4662
input::input-placeholder{color: #bdbdbd ;} /* 有些资料显示需要写，有些显示不需要，但是在编辑器webstorm中该属性不被识别 */ ::-webkit-input-placeholder { /* WebKit browsers */ color: #999; } :-moz-placeholder { /* Mozilla Firefox ...
HTML用css让input无法使用,html – 是否可以使用CSS设置一个禁用的INPUT元素？
weixin_42516657的博客
06-21 169
我需要设置禁用的< select>元素,使其看起来像启用它们.有人可以帮忙吗？PS.我完全知道对HCI原则等做这样的事情的缺点,但是它的要求,所以我必须做,如果可能的话…谢谢.编辑：@AlexThomas’方法在HTML代码中禁用元素时效果很好,但不幸的是我正在使用JQuery进行禁用/启用：MondayTuesday$(".dayselector").attr("disabled",...
修改输入框placeholder文字默认颜色-webkit-input-placeholder方法
09-28
本文将详细介绍如何使用CSS来修改输入框`placeholder`文字的默认颜色，特别是通过`-webkit-input-placeholder`方法。这个方法主要针对基于WebKit渲染引擎的浏览器，如Chrome和Safari，因为`-webkit-`前缀用于指定...
css移动版兼容性问题记录
10-26
为了确保网站在不同设备上的良好展示，前端开发者必须考虑各种移动设备的特性及其浏览器兼容性问题。本文旨在记录常见的移动端CSS兼容性问题及其解决方案，帮助前端开发者更好地进行移动页面的开发工作。 #### 常见...
详解移动端HTML5页面端去掉input输入框的白色背景和边框（兼容Android和ios）
12-14
由于`appearance`不是所有浏览器都支持的标准属性，所以还添加了 `-moz-appearance` 和 `-webkit-appearance` 的前缀，以确保在Firefox和Safari等浏览器中也能生效。 以下是具体的CSS代码示例： ```css .date ...
解决placeholder样式设置无效问题，更改placeholder默认样式颜色
Mrlujiao_code的博客
09-17 2353
错误示范： input::-webkit-input-placeholder, input:-moz-placeholder, input::-moz-placeholder, input:-ms-input-placeholder{ color: #111111 } 这样常常不会有任何效果，必须分开写： 正确写法： input::-webkit-input-placeholder{ color: #111111; } input:-moz-placeholder{ color: #111111;
css控制页面文字不能被选中user-select:none；
盏茶作酒的博客
07-02 1390
现象：html中可能有些地方不想让用户复制文字，或是用a标签做了个点击按钮，点快的时候文字会被选中，很丑，这个时候可以使用下面的方案禁止文字选中。 原因：鼠标点快了文字会被选中。 解决方案：不同的浏览器设置的内容不一样，user-select不是一个W3C的标准，浏览器的支持不完成，需要对不同的浏览器进行调整。 body{ -moz-user-select:none;/*火狐*/ -webkit-user-select:none;/*webkit浏览器*/ -ms-user-select:non
css控制页面文字不能被选中user-select:none;
青云码上的博客
11-08 629
css控制页面文字不能被选中user-select:none; html中可能有些地方不想让用户复制文字，或是用a标签做了个点击按钮，点快的时候文字会被选中，很丑，这个时候可以使用下面的方案禁止文字选中。 给该元素设置css即可：user-select:none; &lt;p style="user-select:none"&gt;不让选中的文字...
el-input__inner样式不生效问题
github_39333092的博客
04-27 6575
方法1 父组件的 scoped 样式不能穿透到子组件上。 使用 /deep/ 或者 >>> 解决 /deep/.el-input__inner { color: black; } 方法2 在vue中，把style的scoped去掉就可以了。跟作用域有关 但这种方法不可取，把scoped去掉，其他页面的有这个类的话，也会跟着改。 方法3 重新定义一个类名，然后再写样式 .inputColorBlack{ .el-input__inner { color: black;
每日一记：ie浏览器中CSS3 -webkit-transform(元素变换)不生效的解决方案
点滴的幸福
01-17 2842
在谷歌浏览器中，CSS3 -webkit-transform(元素变换)这个参数是没问题的，但在ie或者edge浏览器中就失效了。 经过搜索，发现将前边的"-webkit-"去掉就可以了。 不知道这是不是正道，但至少解决了问题。 有知道的朋友吗？ ...
Chrome不能显示小于12px的字体的解决办法，同时解决-webkit-transform: scale不支持行内标签的问题
Rudon滨海渔村的博客
05-07 6418
解决方案让指定文字使用自定义的class，如forcefontsize10&lt;a&gt; Products &lt;sup class="forcefontsize10"&gt; 88 &lt;/sup&gt; &lt;/a&gt;并在css中自定义以下类：.forcefo...
input box-shadow苹果手机不生效
最新发布
05-23
可能是因为苹果手机对于box-shadow的渲染方式与其他浏览器有所不同。尝试使用以下CSS属性来解决这个问题： -webkit-box-shadow: /* your shadow ...另外，还可以尝试调整阴影的大小和位置，以确保其在苹果手机上可见。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

澄清寰宇

如果有用请给我一根烟钱

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值