CSS里一个奇怪的属性

事情是这样的,在一个手机界面的制作中,我发现按钮点击后总会出现一个边框,于是开始搜索解决方案。搜到的解决方案是这样的。

a:focus,input:focus{
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    -webkit-user-modify:read-write-plaintext-only;
}

边框问题解决后我2333地把这两行代码加入到common.css,之后的页面直接ctrl+c ctrl+v。但是问题马上来了。我所有的<a></a>都成了可编辑的。

问题毫无疑问出在-webkit-user-modify这个属性上。

它的值有 read-only(只读) read-write(可读写) read-write-plaintext-only(可读写)。默认情况下无疑是read-only。

对于read-write(可读写) read-write-plaintext-only(可读写)两种状态,read-write可以添加图片等, read-write-plaintext-only不能。

对于input,textarea元素,无论我如何修改user-modify,他们没有任何变化。

在火狐浏览器下,属性在firebug中有显示,但是没有什么作用。

先更到这得了,测试得烦了。

时间: 2024-08-11 09:50:57

CSS里一个奇怪的属性的相关文章

一、背景 1.如何设置标签的背景颜色 (1)在CSS中有一个background-color:属性值;,就是专门用来设置标签的背景颜色。 (2)取值:具体单词、RGB、RGBA、十六进制 例子:

<style> .p1{ background-color: red; } .p2{ background-color: rgb(0,255,0); } .p3{ background-color: rgba(0,0,255,1); } .p4{ background-color: #00ffff; } </style> </head> <body> <p class="p1">我是试练</p> <p cla

做一个手机端页面时,遇到了一个奇怪的问题:字体的显示大小,与在CSS中指定的大小不一致

最近在做一个手机端页面时,遇到了一个奇怪的问题:字体的显示大小,与在CSS中指定的大小不一致.大家可以查看这个Demo(记得打开Chrome DevTools). 就如上图所示,你可以发现,原本指定的字体大小是24px,但是最终计算出来的却是53px,看到这诡异的结果,我心中暗骂一句:这什么鬼! 随后开始对问题各种排查:某个标签引起的?某个CSS引起的?又或者是某句JS代码引起的.通过一坨坨的删代码,发现貌似都不是.我不禁又骂,到底什么鬼!不过中间还是发现了一些端倪:当页面中的标签数量或者文本数

使用CSS里的user-select属性控制用户在页面上选中的内容

CSS里的user-select属性用来禁止用户用鼠标在页面上选中文字.图片等,也就是,让页面内容不可选.也可以只允许用户选中文字,或者全部都放开,用户可以同时选中文字.还包括文本里的图片.视频等其它东西.user-select属性的作用是元素级别的,它不仅可以作用整个页面,也可以只在指定的元素和其子元素上生效. "user-select"属性在各大浏览器里都还是实验性的属性,以后有可能废弃,也有可能转正,目前使用各种浏览器引擎前缀,它的作用还是能发挥的不错的. user-select

CSS里display属性

css里display属性 在了解css的display属性之前,我想先介绍一下display属性所能改变的元素都有什么. 元素类型 元素类型可分为三种,分别是: 块状元素(例如div.dl.form.p等) 内联元素(例如a.b.br.img.input等) 可变元素 也可以分为:块状元素.内联元素.内联块元素 而在盒子模型可通过display属性改变默认的显示类型. display的属性 盒子模型可通过display属性来改变默认的显示类型 display的属性值 display的属性值有许

css字体样式(Font Style),属性

css字体样式(Font Style),属性 css字体样式(Font Style)是网页中不可或缺的样式属性之一,有了字体样式,我们的网页才能变得更加美观,因此字体样式属性也就成为了每一位设计者必需了解的知识.以下是我精心整理的css字体样式属性知识,供大家学习参考: css文本样式 序号 中文说明 标记语法 1 字体样式 {font:font-style font-variant font-weight font-size font-family} 2 字体类型 {font-family:"

css里的BFC用法

css里的BFC用法 BFC(Block Formatting Contexts),可以把BFC理解为一个封闭的大箱子,容器里面的子元素不会影响到外面的元素. 规则 1.内部的盒子会在垂直方向,一个个地放置. 2.BFC是页面上的一个隔离的独立容器,容器里面的子元素不会影响到外面的元素 3.属于同一个BFC的两个相邻BOx的上下margin会发生重叠 4.计算BFC的高度时,浮动元素也参与计算 5.每个元素的左边,与包含的盒子的左边相接触,即使存在浮动也是如此: 6.BFC的区域不会与float

CSS实现一个粒子动效的按钮

原文链接 github.com/XboxYan/not… 按钮(button)可能是网页中最常见的组件之一了,大部分都平淡无奇,如果你碰到的是一个这样的按钮,会不会忍不住多点几次呢? 通常这类效果第一反应可能就是借助canvas了,比如下面这个案例 效果就更加震撼了,当然canvas实现也有一定的门槛,而且实际使用起来也略微麻烦(所有js实现的通病),这里尝试一下CSS的实现方式. 生成粒子 抛开js方案,还有HTML和CSS实现方式.HTML就不用说了,直接写上大量的标签 <button>

用css实现一个空心圆,并始终放置在浏览器窗口左下角

用css实现一个空心圆,并始终放置在浏览器窗口左下角         div{                 position:fixed;                 bottom:0;                 left:0;                 width:100px;                 height:100px;                 border:2px solid #000;                 border-radius:

##oc在类别里给类加属性以及原理

oc在类别里给类加属性以及原理 如何在类别里给类加属性呢,有鸭子模样的我们就认为他是鸭子了. @interface NSObject (XY) @property (nonatomic, strong) id tempObject; @end @implementation NSObject (XY) @dynamic tempObject; - (id)tempObject - { id object = objc_getAssociatedObject(self, NSObject_key_