美文网首页读书
HTMLH和CSS3有哪些新特性

HTMLH和CSS3有哪些新特性

作者: LiJiaSi | 来源:发表于2021-05-25 14:41 被阅读0次

HTML5

(1)问题分析

对于目前市场上来说HTML5中需要掌握的新特性有:

1.拖拽释放(Drag and drop) API

2.语义化更好的内容标签(header,nav,footer,aside,article,section)

3.音频、视频API(audio,video)

4.画布(Canvas) API

5.地理(Geolocation) API

6.本地离线存储 localStorage 长期存储数据,浏览器关闭后数据不丢失;

7.sessionStorage 的数据在浏览器关闭后自动删除

8.表单控件,calendar、date、time、email、url、search

9.新的技术webworker, websocket, Geolocation

其中画布和地理api,本地存储用的比较的多。

(2)核心问题讲解

语义化标签,例如,多媒体就是可以添加视频元素。

Canvas、svg,是实现前端数据可视化必不可少的东西。

离线存储:用于优化用户体验。

(3)问题扩展

语义化标签可以更容易的理解这一块的代码是做什么的。

例如,用户收货地址,可以用Localstorage存储用户当前的收货地址,如果没有新的添加就直接从localstorage中取出。

(4)结合项目中使用

例如:语义化标签、用来做导航栏的标签、使用多媒体增加页面的炫酷程度。

Canvas、svg可以使用echarts、d3.js 制作数据可视化,简单又方便离线存储用于优化用户网速慢导致页面空白问题。

CSS3

(1)问题分析

该题旨在考核求职者对 CSS3的相关新特性有较为深入地了解。

(2)核心问题讲解

在回答这个问题的策略:先告诉面试官CSS3在CSS的基础上面,不仅添加了新的属性还有选择器也做了扩展。

接下来开始列举:

1)先从颠覆性的属性开始比如:rotate(旋转),translate(位移),scale(缩放)等

2)Css3的动画 animation

3)还有是css3的过渡, transition: all 1s;

4)再列举一些简单的属性比如说: border-radius(圆角),box-shadow(盒子阴影),border-shadow(边框阴影)等

5)新增了结构伪类选择器,像 first-child,nth-child(n)之类的

6)先从颠覆性的属性开始比如:rotate(旋转),translate(位移),scale(缩放)等

7)Css3的动画 animation

8)还有是css3的过渡, transition: all 1s;

9)再列举一些简单的属性比如说: border-radius(圆角),box-shadow(盒子阴影),border-shadow(边框阴影)等

10)新增了结构伪类选择器,像 first-child,nth-child(n)之类

想进一步了解HTML5,CSS3可以观看一下教学视频:零基础前端视频教程_html5+css3+移动web实战项目

相关文章

  • HTMLH和CSS3有哪些新特性

    HTML5 (1)问题分析 对于目前市场上来说HTML5中需要掌握的新特性有: 1.拖拽释放(Drag and d...

  • CSS的一些整理(面试向)

    CSS3有哪些新特性? RGBA和透明度; background-image background-origin(...

  • 前端面试题及答案3

    一、. CSS3有哪些新特性? CSS3实现圆角(border-radius),阴影(box-shadow), 对...

  • HTML5,CSS3初级面试题

    CSS3新特性有哪些? 选择器类first-childlast-childnth-child:checked 文字...

  • HTML5和CSS3新增内容

    CSS3选择器有哪些? 属性选择器、伪类选择器、伪元素选择器。 CSS3新特性有哪些? 颜色:新增RGBA,HSL...

  • 前端基础搬运工-H5C3模块

    八、H5C3模块 基础部分 1. CSS3有哪些新特性? - [ ] 1. CSS3实现圆角(border-ra...

  • 前端面试题集(3)

    1.CSS3有哪些新特性 CSS3实现圆角(border-radius),阴影(box-shadow), 对文字加...

  • CSS3有哪些新特性?

    ① CSS3实现圆角(border-radius:8px),阴影(box-shadow:10px);② 对文字加特...

  • CSS3相关知识练习

    一、问答 CSS3有哪些常见的新特性? ** 1、CSS 选择器 **例如:E:nth-child(even),E...

  • 面试题一二

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

网友评论

    本文标题:HTMLH和CSS3有哪些新特性

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