文档章节

CSS 有哪些暖心却鲜为人知的属性?

兔先森的小沫儿
 兔先森的小沫儿
发布于 2016/01/28 10:06
字数 413
阅读 3
收藏 0
点赞 1
评论 0

        user-modify 

css版的contenteditable
使用方法:

user-modify: read-only;user-modify: read-write;user-modify: write-only;user-modify: read-write-plaintext-only;

其中read-only为默认值,write-only是来搞笑的,read-write和contenteditable="true"效果一致,read-write-plaintext-only和contenteditable="plaintext-only"效果一致(没错这属性还有这个值但是还是草案中)。
至于兼容性么,就跟这玩意儿为人所知的程度一样,贫乏得可怜,目前IE浏览器不明,FF只支持前三个属性,Chrome高版本可以全部支持,但是全都要加上私有前缀。
适用场景的话,大概就是contenteditable的css版,想要做高度自适应的文本编辑框,又不想在粘贴复制的时候把html给复制进去。生产环境还是老老实实用js来搞吧。


        pointer-event

最常用的属性:

pointer-event: none;

这个属性的作用就是把元素变成“幻影”(逼格很高有没有),看得见却摸不着。
这属性曾经火过一阵,起因是国外某推主说在页面滚动时给body加上这个属性能够禁用hover从而有效提高FPS,还给出了相关测试数据。但是在各位网友的质疑和测试下发现实际效果不如数据展示的那么美好,一是各家浏览器都有针对滚动时指针hover的优化,二是这个属性会导致页面无法响应触屏,后来就不了了之了。
现在还在使用的场景大概只剩下通过pointer-event:none加上去除href属性来360度无死角的禁用a标签这一项了吧。


© 著作权归作者所有

共有 人打赏支持
兔先森的小沫儿
粉丝 0
博文 20
码字总数 12000
作品 0
郑州
爱创课堂每日一题九十九天- 行内元素有哪些?块级元素有哪些? 空(void)元素有

CSS规范规定,每个元素都有display属性,确定该元素的类型,每个元素都有默认的display值,比如div默认display属性值为“block”,成为“块级”元素;span默认display属性值为“inline”,是...

全栈web笔记 ⋅ 01/31 ⋅ 0

爱创课堂每日一题九十六天- 行内元素有哪些?块级元素有哪些? 空(void)元素有

1)CSS规范规定,每个元素都有display属性,确定该元素的类型,每个元素都有默认的display值,比如div默认display属性值为“block”,成为“块级”元素;span默认display属性值为“inline”,...

全栈web笔记 ⋅ 01/27 ⋅ 0

前端知识 | CSS小技巧-自适应椭圆

背景知识: border-radius 属性的基本用法。 难题: 你可能注意到过,给任何正方形元素设置一个足够大的 border-radius,就可以把它变成一个圆形。所用到的 CSS 代码如下所示: 图1.1给元素设...

海说软件 ⋅ 01/18 ⋅ 0

前端新人关注的Web前端饱和性分析?前端面试必知必会的十点!

现在前端市场是不是已经饱和了?巴巴巴巴巴...... 还有:XXX行业是否已经饱和? angular1.5是不是已经被淘汰? 前端还有前途吗? bootstrap为什么被称为垃圾框架?等等等 不是博主不友好,只...

web前端05 ⋅ 06/15 ⋅ 0

CSS样式有哪些常用的属性?

一般的一个DIV的CSS设置属性有:margin,padding,width,height,font-size,text-align,background,float,border CSS样式有哪些常用的属性 附:《 css样式属性大全(中文注释)》 一 CSS文字属性...

inw3cschool ⋅ 2017/05/27 ⋅ 0

WEB 前端工程师面试题

1.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? 2:行内元素有哪些?块级元素有哪些?CSS的盒模型? 3.CSS引入的方式有哪些? link和@import的区别是? 4.CSS选择符有哪...

0000001 ⋅ 2011/05/13 ⋅ 2

前端开发面试题总结之——CSS3

相关知识点 题目&答案 如何理解CSS的盒子模型? link和@import的区别? CSS 选择符有哪些?哪些属性可以继承?优先级算法如何计算?CSS 3新增伪类有哪些? 如何居中div,如何居中一个浮动元素...

sandisen ⋅ 2017/02/18 ⋅ 0

令人难以置信的纯 CSS3 图标

尽管被批评为走火入魔,CSS3 痴迷者们仍然在尝试实现各种基于纯 CSS 的图形与图标设计,如果你看到本文介绍的这些精美图标,你绝对不会相信它们完全是由 CSS3 代码生成的。尤其是那套由 Loui...

古欣 ⋅ 2010/09/13 ⋅ 6

letter-spacing和word-spacing区别有哪些

一、CSS中word-spacing属性 1、检索或设置对象中的单词之间插入的空格数。由浮点数字和单位标识符组成的长度值,允许为负值。 2、默认值为 normal,等同于设置为0 3、CSS把“字(word)”定义...

学习也休闲 ⋅ 2015/09/16 ⋅ 0

前端开发面试题--html

Doctype作用?严格模式与混杂模式如何区分?它们有何意义? doctype是告诉浏览器我的html使用哪个版本的html协议写的,让浏览器按照神明的协议执行。 区别:严格模式是浏览器根据规范去显示页...

邪气小生 ⋅ 2016/04/07 ⋅ 2

没有更多内容

加载失败,请刷新页面

加载更多

下一页

RabbitMQ学习以及与Spring的集成(三)

本文介绍RabbitMQ与Spring的简单集成以及消息的发送和接收。 在RabbitMQ的Spring配置文件中,首先需要增加命名空间。 xmlns:rabbit="http://www.springframework.org/schema/rabbit" 其次是模...

onedotdot ⋅ 17分钟前 ⋅ 0

JAVA实现仿微信红包分配规则

最近过年发红包拜年成为一种新的潮流,作为程序猿对算法的好奇远远要大于对红包的好奇,这里介绍一种自己想到的一种随机红包分配策略,还请大家多多指教。 算法介绍 一、红包金额限制 对于微...

楠木楠 ⋅ 29分钟前 ⋅ 0

Python 数电表格格式化 xlutils xlwt xlrd的使用

需要安装 xlutils xlwt xlrd 格式化前 格式化后 代码 先copy读取的表格,然后按照一定的规则修改,将昵称中的学号提取出来替换昵称即可 from xlrd import open_workbookfrom xlutils.copy ...

阿豪boy ⋅ 58分钟前 ⋅ 0

面试题:使用rand5()生成rand7()

前言 读研究生这3 年,思维与本科相比变化挺大的,这几年除了看论文、设计方案,更重要的是学会注重先思考、再实现,感觉更加成熟吧,不再像个小P孩,人年轻时总会心高气傲。有1 道面试题:给...

初雪之音 ⋅ 58分钟前 ⋅ 0

Docker Toolbox Looks like something went wrong

Docker Toolbox 重新安装后提示错误:Looks like something went wrong in step ´Checking if machine default exists´ 控制面板-->程序与应用-->启用或关闭windows功能:找到Hyper-V,如果处......

随你疯 ⋅ 今天 ⋅ 0

Guacamole 远程桌面

本文将Apache的guacamole服务的部署和应用,http://guacamole.apache.org/doc/gug/ 该链接下有全部相关知识的英文文档,如果水平ok,可以去这里仔细查看。 一、简介 Apache Guacamole 是无客...

千里明月 ⋅ 今天 ⋅ 0

nagios 安装

Nagios简介:监控网络并排除网络故障的工具:nagios,Ntop,OpenVAS,OCS,OSSIM等开源监控工具。 可以实现对网络上的服务器进行全面的监控,包括服务(apache、mysql、ntp、ftp、disk、qmail和h...

寰宇01 ⋅ 今天 ⋅ 0

AngularDart注意事项

默认情况下创建Dart项目应出现以下列表: 有时会因为不知明的原因导致列表项缺失: 此时可以通过以下步骤解决: 1.创建项目涉及到的包:stagehand 2.执行pub global activate stagehand或pub...

scooplol ⋅ 今天 ⋅ 0

Java Web如何操作Cookie的添加修改和删除

创建Cookie对象 Cookie cookie = new Cookie("id", "1"); 修改Cookie值 cookie.setValue("2"); 设置Cookie有效期和删除Cookie cookie.setMaxAge(24*60*60); // Cookie有效时间 co......

二营长意大利炮 ⋅ 今天 ⋅ 0

【每天一个JQuery特效】淡入淡出显示或隐藏窗口

我是JQuery新手爱好者,有时间就练练代码,防止手生,争取每天一个JQuery练习,在这个博客记录下学习的笔记。 本特效主要采用fadeIn()和fadeOut()方法显示淡入淡出的显示效果显示或隐藏元...

Rhymo-Wu ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部