一. H5中新增了哪些内容?
1. H5包含html5,css3,新增的webAPI
2. html中新增了header,footer,main,nav等语义化标签,媒体标签,canvas画布,还有一些标签属性,如input的里面
3. css中新增了圆角,阴影,flex布局,媒体查询,过度和动画,伪类
4.webAPI新增了localStorage与sessionStorage,webSocket,Worker,地理位置等
二. html语义化的好处?
结构清晰,便于对浏览器,搜索引擎解析;利于seo;也便于网站阅读维护
三. css 中position定位?
static: 静态定位, 流式布局.
relative: 相对定位,参与流式布局,可以使用top, left 等在原有位置上进行位置调整 .
absolute: 绝对定位,脱离文档流,相对于父级元素进行定位(相对于离自己最近的, position为非static的祖先级元素进行定位).
fixed: 固定定位,脱离文档流 ,相对于浏览器窗口定位,不随页面滚动而去改变位置
sticky: 粘性定位,可实现动态fixed.
四. 动画,适用于哪些场景?
transition: 简单的动画, 只需要在两个状态之间的动画,需要通过事件触发
keyframAnimation: 适合需要在多个状态连续进行的动画 ,可以自动播放
js动画: 功能最强的动画,但是效率最低
五. 怎么隐藏页面中的某个元素?
dispaly:none; (隐藏不占位)
visibility:hidden;
opacity:0 ;
六. 行内元素和块元素的区别?
行元素: 由内容撑宽,在水平方向排列,设置宽高,上下边距无效
块元素: 独占一行,可设宽高,内外边距
行内块级元素: 在水平方向排列,可设置宽高,内外边距
七.标准盒模型和怪异盒模型的区别?
标准: width= width 内容宽就只是内容的宽度
怪异: width= width+padding(左右)+border(左右) 内容的宽=内容的宽度+padding(左右)+border(左右)
拓展: 元素盒模型 :通过box-sizing设置计算方式，默认为content-box,及计算内容盒，可以设置为border-box,计算到边框盒。
八. 单行文本溢出显示为省略号?
text-overflow: ellipsis;
overflow:hidden;
white-space:nowrap;
九. 怎么实现元素上下左右都居中?
1)实现元素本身内容居中: text-align:center+行高
2)实现子元素在父元素中居中 : 绝对定位+上下左右设置0+maegin:auto
3)使用flex弹性布局 (ie8不支持)
4)绝对定位+left ,top:50%;+transform:translate:-50%
十. 去除浮动?
在浮动元素的父元素上添加一个class,为这个class添加后缀.after样式,其中写conter:""; display:block; clear:both;
十一. ::before和::after伪元素的作用?
单冒号(:)用于CSS3伪类，双冒号(::)用于CSS3伪元素 , ::before就是以一个子元素的存在，定义在元素主体内容之前的一个伪元素。并不存在于dom之中，只存在在页面之中
十二.如何实现浏览器内多个标签页之间的通信?
调用 localstorge、cookies 等本地存储方式
十三. 你如何对网站的文件和资源进行优化？
文件合并
文件最小化/文件压缩
使用CDN托管
缓存的使用
十四.怎么实现页面设计图???
自己思考喽!
posted on
