使用新的CSS类型对象模型
el.attributeStyleMap.set('padding', CSS.px(42));
const padding = el.attributeStyleMap.get('padding');
console.log(padding.value, padding.unit); // 42, 'px'
// Element styles.
el.attributeStyleMap.set('opacity', 0.3);
typeof el.attributeStyleMap.get('opacity').value === 'number' // Yay, a number!
// Stylesheet rules.
const stylesheet = document.styleSheets[0];
stylesheet.cssRules[0].styleMap.set('background', 'blue');
// All 3 of these are equivalent:
el.attributeStyleMap.set('opacity', 0.3);
el.attributeStyleMap.set('opacity', '0.3');
el.attributeStyleMap.set('opacity', CSS.number(0.3)); // see next section
// el.attributeStyleMap.get('opacity').value === 0.3
// StylePropertyMaps are iterable.
for (const [prop, val] of el.attributeStyleMap) {
console.log(prop, val.value);
}
// → opacity, 0.3
el.attributeStyleMap.has('opacity') // true
el.attributeStyleMap.delete('opacity') // remove opacity.
el.attributeStyleMap.clear(); // remove all styles.
if (window.CSS && CSS.number) {
// Supports CSS Typed OM.
}
使用新的CSS类型对象模型的更多相关文章
- Sql Server 新的日期类型
新的日期类型:是出现在2008中的在2005中没有的日期类型. 1,Date 数据类型 2,time 数据类型 3, datetime2 数据类型 4, datetimeoffset 数据类型 ...
- 【ElasticSearch】ES5新特性-keyword-text类型-查询区别
ES5新特性-keyword-text类型-查询区别 elasticsearch-head Elasticsearch-sql client junneyang (JunneYang) es keyw ...
- 如何增加新的PointT类型
博客转载自:http://www.pclcn.org/study/shownews.php?lang=cn&id=286 为了增加新的point类型,首先需要进行定义,例如: struct M ...
- C#中的扩展方法(向已有类添加方法,但无需创建新的派生类型)
C#中的扩展方法 扩展方法使你能够向现有类型"添加"方法,而无需创建新的派生类型.重新编译或以其他方式修改原始类型. 扩展方法是一种特殊的静态方法,但可以像扩展类型上的实例方法一样 ...
- Source Insight添加新的文件类型
1.前言 Source Insight这个软件工具功能非常强大,很适合用来分析一些大型的code工程,例如Linux内核源码,本文将简单介绍如何在Source Insight工程中添加一种新的文件类型 ...
- Python 3 新特性:类型注解——类似注释吧,反正解释器又不做校验
Python 3 新特性:类型注解 Crossin 上海交通大学 计算机应用技术硕士 95 人赞同了该文章 前几天有同学问到,这个写法是什么意思: def add(x:int, y:int) - ...
- Java将引入新的对象类型来解决内存利用问题
2022年Java将有什么新的特性和改进,我相信很多Java开发者都想知道.结合Java语言架构师布莱恩·格茨(Brian Goetz)最近的一些分享,胖哥给大家爆个料.老规矩,点赞走起. Valha ...
- 2022 年最受瞩目的新特性 CSS @layer 到底是个啥?
步入 2022,CSS 的新特性层出不穷,而最近在 CSS 圈最受瞩目的新特性,非 CSS @layer 莫属. 本文,将用最简洁的语言,快速让读者们搞懂,到底什么是 CSS @layer 新规范. ...
- 个人博客制作如何选择前端模板 thinkcmf后台加载新模板 CSS js文件
我们的博客后台已经搭建好了,接下来我就要选择一个合适的模板做自己的博客,首先要定位你的博客是做什么用的,是属于什么行业,根据自己博客的定位选择适合的模板. 如果你是设计师,又会前端设计开发,那就可以自 ...
随机推荐
- (转)OpenLayers3基础教程——OL3之Popup
http://blog.csdn.net/gisshixisheng/article/details/46794813 概述: 本节重点讲述OpenLayers3中Popup的调用时实现,OL3改用O ...
- (转) OpenLayers3基础教程——OL3 介绍control
http://blog.csdn.net/gisshixisheng/article/details/46761535 概述: 本文讲述的是Ol3中的control的介绍和应用. OL2和OL3 co ...
- SUSE 11 SP3 搭建weblogic服务
环境的搭建和业务需求相关,仅供参考 环境: SUSE 11 SP3 安装步骤 创建一个weblogic组 创建一个用户名为weblogic的用户, 创建相关目录 上传jdk,脚本等 安装 创建用户及其 ...
- 51nod1134 最长递增子序列【动态规划】
给出长度为N的数组,找出这个数组的最长递增子序列.(递增子序列是指,子序列的元素是递增的) 例如:5 1 6 8 2 4 5 10,最长递增子序列是1 2 4 5 10. Input 第1行:1个数N ...
- linux下关闭键盘的重复击键
https://askubuntu.com/questions/576421/disable-keyboard-repeat-from-command-line You can use the xse ...
- kissui.scrollanim页面滚动动画库插件
简介 kissui.scrollanim是一款实用的纯JS和CSS3页面滚动动画库插件.通过该插件可以使元素进入浏览器视口的时候,展示指定的CSS3动画效果. 下载地址及演示 在线演示 在线下载 安装 ...
- Problem 52
Problem 52 It can be seen that the number, 125874, and its double, 251748, contain exactly the same ...
- mysql use index () 优化查询的例子
USE INDEX在你查询语句中表名的后面,添加 USE INDEX 来提供你希望 MySQ 去参考的索引列表,就可以让 MySQL 不再考虑其他可用的索引.Eg:SELECT * FROM myta ...
- Docker installation in sles SP2
Please refer to official site for installation details : https://docs.docker.com/install/linux/doc ...
- magento 的一些Sql查询
1,模拟使用getName()获取产品名称的sql SELECT `value` AS product_name FROM yo_catalog_product_entity_varchar WHER ...