1、HTML总结
1、html和xhtml的区别
- xhtml元素必须被正确地嵌套
- xhtml元素必须被关闭
- xhtml大小写敏感,标签名必须用小写字母
- xhtml必须用根元素
2、html5中新标签
- header nav section aside footer article hgroup figure
3、如果将html5看成一个开放平台,它的构建某事有哪些?
- web storage api
- 基于位置服务的LBS
- 无插件音频和视频
- 拖拽、from api、通信api及web work api
4、html5 中data-属性作用
答:设置我们需要的属性来存放数据,可以通过el.dataset.属性名(驼峰式)获取属性,可以通过类似于 .user[data-name = "page'']{ /* styles */ }
5、session,cookies,localstorage和sessionstorage的区别
- cookies用来在客户端存储用户信息,session用来在服务端储存用户数据,session比cookies更安全,用户验证等重要信息一般存放在session中,但cookies也可以通过加密来提高安全性,同时可以设置httponly为true来使js无法操作cookies,防止xss(跨站脚本攻击)
- cookies如果不主动删除将永久保存,最大为4kb,session则只存在于会话期间,当session增多会增加服务端压力
- session支持各种类型的对象, cookies只保存字符串
- session的实现基于cookies的支持,session依赖于sessionID实现,而sessionID存放在cookies,因此禁用了cookies之后session也会失效,但可以用过在url中传递sessionID
- cookise默认会传入到服务端,而localstroage和sessionStroage不会,
- localstroage和sessionStroage都是html5提供的webstroage api,都是在浏览器端保存数据,其中sessionStroage引入了浏览器窗口的概念,只有同源同窗口的数据才能共享,刷星和跳入新窗口都存在,而独立的打开两个同一个页面,也不能共享,关闭浏览器即清除sessionStroage,
- localstroage和sessionStroage提供了setItem、getItem、removeItem和clear方法来操作数据,而cookies需要自己封装setCookis和getCookies方法,同时getItem获取到的是数据副本,不能再用赋值方式改变数据的值
2、CSS总结
1、@import和link的区别
- link是html提供的元素标签,@import只能加载css,必须放在style标签中,link还可以加载RSS
- @import在加载dom之后加载,会出现闪烁
- @import可以继续import文件
2、css3新属性介绍 - 圆角 border-radius(x, y, z, w)依次为 左上角 右上角 右下角 左下角;如果只有两个值左上角/右下角 、 右上角和左下角
- 阴影效果 box-shadow: 颜色 水平距离 垂直距离 模糊量
- 自定义字体 font-face
- 线性渐变 linear-gradient background:linear-gradient(start positon, from color, to color)
- 放射渐变 radial-gradient background: radial-gradient(position, circle, from, to)
- rgba(color, color, color, opacity)
- 转换和转变
1、缩放 scale(A, B); A处于0~1时缩小元素, 1正常,>1:增加元素尺寸;B可使用负数,出现镜像效果(更真实)。
2、旋转 rotate(deg)
3、倾斜 skew(水平(10px), 垂直(10px))
4、移动 translate(水平, 垂直)
5、transfrom 和 transition