html5,css3新特性

作者: 秋天de童话 | 来源:发表于2017-06-03 19:35 被阅读503次
html5:
  1. 用于绘画的 canvas 元素 以及SVG

  2. 用于媒介回放的 video 和 audio 元素

  3. 拖拽(Drag 和 drop) 地理定位(Geolocation)

  4. 对本地离线存储的更好的支持
    (localStorage - 没有时间限制的数据存储
    sessionStorage - 针对一个 session 的数据存储
    之前,这些都是由 cookie 完成的。但是 cookie 不适合大量数据的存储,因为它们由每个对服务器的请求来传递,这使得 cookie 速度很慢而且效率也不高。
    在 HTML5 中,数据不是由每个服务器请求传递的,而是只有在请求时使用数据。它使在不影响网站性能的情况下存储大量数据成为可能。
    对于不同的网站,数据存储于不同的区域,并且一个网站只能访问其自身的数据。)

  5. 新的特殊内容元素,比如 article、footer、header、nav、section

  6. 新的表单控件,比如 calendar、date、time、email、url、search

  7. 新的 form 属性:
    autocomplete
    novalidate

  8. 新的 input 属性:
    autocomplete
    autofocus
    form
    form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget)
    height 和 width
    list
    min, max 和 step
    multiple
    pattern (regexp)
    placeholder
    required

  9. 语义元素:有利于搜索引擎优化和快速查找
    HTML5 添加了很多语义元素如下所示:
    标签 描述
    <article> 定义页面独立的内容区域。
    <aside> 定义页面的侧边栏内容。
    <bdi> 允许您设置一段文本,使其脱离其父元素的文本方向设置。
    <command> 定义命令按钮,比如单选按钮、复选框或按钮
    <details> 用于描述文档或文档某个部分的细节
    <dialog> 定义对话框,比如提示框
    <summary> 标签包含 details 元素的标题
    <figure> 规定独立的流内容(图像、图表、照片、代码等等)。
    <figcaption> 定义 <figure> 元素的标题
    <footer> 定义 section 或 document 的页脚。
    <header> 定义了文档的头部区域
    <mark> 定义带有记号的文本。
    <meter> 定义度量衡。仅用于已知最大和最小值的度量。
    <nav> 定义导航链接的部分。
    <progress> 定义任何类型的任务的进度。
    <ruby> 定义 ruby 注释(中文注音或字符)。
    <rt> 定义字符(中文注音或字符)的解释或发音。
    <rp> 在 ruby 注释中使用,定义不支持 ruby 元素的浏览器所显示的内容。
    <section> 定义文档中的节(section、区段)。
    <time> 定义日期或时间。
    <wbr> 规定在文本中的何处适合添加换行符。

css3:
  1. CSS3实现圆角(border-radius),阴影(box-shadow),
  2. 对文字加特效(text-shadow、),线性渐变(gradient),旋转(transform)
  3. transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0deg);// 旋转,缩放,定位,倾斜
  4. 增加了更多的CSS选择器 多背景 rgba
  5. 在CSS3中唯一引入的伪元素是 ::selection.
  6. 媒体查询,多栏布局
  7. border-image

相关文章

  • CSS相关文章

    前端面试之 CSS3 新特性 除了 HTML5 的新特性,CSS3 的新特性也是面试中经常被问到的。如何用 js ...

  • 前端面试之 CSS3 新特性

    原文链接 除了html5的新特性,CSS3的新特性也是面试中经常被问到的。 选择器 CSS3中新添加了很多选择器,...

  • 2021 前端技术总结

    一、HTML、CSS、JavaScript。二、HTML5 和 CSS3。要熟悉其中的新特性。如:canvas 等...

  • 《响应式Web设计:HTML5和CSS3实战(第2版)》05章

    响应式Web设计:HTML5和CSS3实战(第2版) 第五章 CSS3 新特性 5.1 CSS能实现什么要心里有数...

  • 面试题一二

    1、如何实现浏览器兼容 2、HTML5特性 3、CSS3特性 CSS3有哪些选择器 4、WebSocket是什么?...

  • 前言

    京东前端实习生面试经验:作为一个前端开发人员,CSS3和HTML5 必须熟练使用CSS3新特性:1、抛弃图片的视觉...

  • C3动画+H5+Flex布局使用总结

    概览 Html5和CSS3就是在原有的基础上新加的一些特性,在前面的博客中已经用很多新特性了,Flex弹性布局大大...

  • HTML5与CSS3的新特性

    现在各大浏览器对H5和CSS3的支持已经很好了,现在来总结一下H5和CSS3的新特性 HTML5 1、新的特殊内容...

  • 03-HTML5&CSS3

    课程目标: HTML5新标签与特性新增表单属性多媒体标签熟练掌握CSS3选择器熟练掌握CSS3过渡熟练掌握CSS3...

  • HTML5新特性

    HTML5新特性

网友评论

    本文标题:html5,css3新特性

    本文链接:https://www.haomeiwen.com/subject/eeemfxtx.html