Html5、Css3、ES6的新特性

更新日期: 2018-09-14阅读: 5.6k标签: 特性

html5的新特性
1.语义化标签
  1. 有利于seo,有助于爬虫抓取更多的有效信息,爬虫是依赖于标签来确定上下文和各个关键字的权重。
  2. 语义化的HTML在没有css的情况下也能呈现较好的内容结构与代码结构
  3. 方便其他设备的解析
  4. 便于团队开发和维护
2.表单新特性
3.多媒体视频(video)和音频(audio)
4.web存储
  1. sessionstorage:关闭浏览器清空数据,储存大小约5M。
  2. localstorage:永久生效,存储大小20M,多窗口下都可以使用
  3. 都只能储存字符串
 
Css3的新特性
1.选择器:属性选择器E[attr],伪类选择器E:nth-child(n),空伪类E:empty ,排除伪类E:not(selector)
2.颜色:新增了RGBA、HSLA模式
3.文本:为文本设置阴影增强文本的表现能力,通过 text-shadow,可分别设置偏移量、模糊度、颜色(可设透明度)。
4.盒模型:box-sizing: border-box;
5.边框:圆角border-radius,阴影box-shadow
6.背景:
  1. 通过 background-size 设置背景图片的尺寸。
  2. 通过 background-origin 可以设置背景图片定位(background-position)的参照原点。
  3. 通过background-clip,可以设置对背景区域进行裁切,即改变背景区域的大小。
7.渐变:线性渐变 linear-gradient,径向渐变radial-gradient
8.字体图标
9.伸缩盒子:调整主轴对齐justify-content,调整侧轴对齐align-items,伸缩分配flex,正序方式排序order
10.2D转换:
  1. translate 设置元素的位置(x/y坐标)
  2. scale 设置元素的缩放比例(x/y两个方向)
  3. rotate 设置元素旋转(正值为顺时针,负值为逆时针)
  4. transform-origin 设置转换元素的原点
11.3D转换:
  1. 透视(perspective)值为1000px~1200px
  2. 将2D元素转换为3D立体(给父元素设置)transform-style: perserve-3d;
  3. 设置元素背面是否可见 backface-visibility: hidden;
12.动画:
  1. 定义关键帧 @keyframes
  2. 通过百分编写帧
  3. 在各帧中分别定义各属性
  4. 通过animation将动画应用于相应元素
 
ES6新特性
  1. 变量声明:let作用:声明变量,块级作用域,必须先声明后使用,在同一个块内不允许重复命名,没有变量提升。const作用:声明常量,声明的同时必须赋值,不能被重新赋值
  2. 解构赋值
  3. 模板字符串,支持换行
  4. 函数扩展,箭头函数

链接: https://fly63.com/article/detial/2392

CSS新特性contain,控制页面的重绘与重排

contain 属性允许我们指定特定的 DOM 元素和它的子元素,让它们能够独立于整个 DOM 树结构之外。目的是能够让浏览器有能力只对部分元素进行重绘、重排,而不必每次都针对整个页面。

ES6新特性--var、let、const

var不存在块级作用域,具有变量提升机制。 let和const存在块级作用域,不存在变量提升。在同一作用域内只能声明一次。const在声明时需要赋值且无法修改,但如果常量是对象,则对象的属性可以修改。

Js即将到来的3个新特性

Optional Chaining(可选链式调用);Nullish coalescing(空值合并);Pipeline operator(管道运算符)通过三个函数对字符串进行处理;

Angular 8的新特性介绍

在今天早些时候Angular团队发布了8.0.0稳定版。其实早在NgConf 2019大会上,演讲者就已经提及了从工具到差分加载的许多内容以及更多令人敬畏的功能。下面是我对8.0.0一些新功能的简单介绍,希望可以帮助大家快速了解新版本

使用 React 要懂的 Js特性

与我使用的其他框架相比,我最喜欢 React 的原因之一就是它对 JavaScript 的暴露程度。没有模板DSL( JSX 编译为合理的 JavaScript),组件 API 只是通过添加 React Hooks 变得更简单,并且该框架为解决的核心 UI 问题提供非常少的抽象概念

ES2019 新特性汇总

最近 ECMAScript2019,最新提案完成:tc39 Finished Proposals,我这里也是按照官方介绍的顺序进行整理,如有疑问,可以查看官方介绍啦~另外之前也整理了 《ES6/ES7/ES8/ES9系列》,可以一起看哈。

Js的用途和特性

JavaScript 最初的目的是为了“赋予网页生命”。这种编程语言我们称之为脚本。它们可以写在 HTML 中,在页面加载的时候会自动执行。脚本作为纯文本存在和执行。它们不需要特殊的准备或编译即可运行。

十个超级实用的 JS 特性

你可能刚上手 JavaScript,或者只是曾经偶尔用过。不管怎样,JavaScript 改变了很多,有些特性非常值得一用。 这篇文章介绍了一些特性,在我看来,一个严肃的 JavaScript 开发者每天都多多少少会用到这些特性

解密HTTP/2与HTTP/3 的新特性

HTTP/2 相比于 HTTP/1.1,可以说是大幅度提高了网页的性能,只需要升级到该协议就可以减少很多之前需要做的性能优化工作,当然兼容问题以及如何优雅降级应该是国内还不普遍使用的原因之一。

为什么我喜欢Js可选链?

很多 JavaScript 的特性极大地改变了你的编码方式。从 ES2015 及更高版本开始,对我的代码影响最大的功能是解构、箭头函数、类和模块系统。可选链(optional chaining)进入了第3阶段,将是一个很好的改进

点击更多...

内容以共享、参考、研究为目的,不存在任何商业目的。其版权属原作者所有,如有侵权或违规,请与小编联系!情况属实本人将予以删除!