面试题：面试

//样式html,body,.wrap{height:100%;overflow:hidden;背景：绿色；}.left,.right,.center{height:100%;}.left,.right{width:100px;background:aqua;}.left{float:left;}.right{float:right;}.center{background:red}marginmar杜松子酒保证金：10px;//上、下、左、右10pxmargin:10px10px;//上下10px，左右10pxmargin:10px10px10px;//向上10px，左右10px，向下10pxmargin:10px10px10px10px;//up10px,right10pxdown10pxLeft10pxmargin:10px10px10px10px10px;//坑边距：10px10px10px10px10px;//坑边距：10px10px10px10px10px10px;//坑边距：10px10px10px10px10px10px;///坑边框roundedborder-radius//左上角，右上角，右下角，左下角10pxborder-radius:10px;//左上，右下，10px，右上，左下，10pxborder-radius:10px10px;//左上10px，左下，右上10p，右下10pxborder-radius:10px10px10px;//左上10px右上10px右下10px左下10pxborder-radius:10px10px10px10px;//左上10px/左上10px右上10px/右上10px右下10px/右下10px左下10px/左下下10pxborder-radius:10px10px10px10px/10px;-半径：10px10px10px10px/10px10px；//左上角10px/左上10px右上，左下10px/右上，左上10p右下10px/右下10pxborder-radius:10px10px10px10px/10px10px10px;//左上10px/左上10px右上10px/右上10px右下10px/右下10px左下10px/左下10pxborder-radius:10px10px10px10px/10px10px10px10px;0像素；高度：0px；边框宽度：60px；边框样式：实心；border-color:redtransparenttransparenttransparent;margin负值如题：有一组li，它们的宽高都是100px，border是10pxgray，每li之间的间隔是10px。当鼠标滑过时，让边框颜色变为红色。整体布局不能乱，边框要充分显示。（用css实现）答：ul>li*N//htmlli{width:100px;高度：100px；边框：10px实心#ccc；边距：-10px00px-10px；职位：相对；}li:hover{border:10px纯红色;z-指数：9；}margin一些坑比如标题：有两个div，宽高都是100px，边框是10px，div1=margin:10px20px30px40px,div2=margin:40px30px20px10px，请注意这两个元素之间的距离是像素；答：上下布局（div1在上，div2在下）：40px；上下布局（div2在上，div1在下）：20px；左右布局（左边div1，右边div2）：30px；布局（左边div2，右边div1）：70px；如题：有两个div，父子关系，parent：parent，child：child；父宽高为100px，子宽高为50p，边距为50px；孩子和父母在哪里？（浏览器的margin和padding已经被清除）。答：child在parent的右上角；父级：距顶部50px，距左侧0px；child：距父级顶部50px，左侧50px，底部50px；如题：有两个div，兄弟关系，div1在最上面，div1宽高100px，添加float：left，div2宽高50px，margin：50px，div1和div2在哪里？手册强调：如何显示？答：div1覆盖div2。div1：距顶部50px，距左侧0px，距底部和右侧0px；div2：距顶部50px，距左侧50px，距底部和右侧50px；附加：如果孩子的外边距是100px，他们的位置呢？display有哪些值？答案：//常用值：block|inline|inline-block|none|table|list-item|继承伪类答案：常用：:link|：悬停|：活跃|：访问|：之后|之前|:第一个孩子|:last-child:nth-child()css3添加了那些属性Answer://个人常用：transform:rotate(90deg);//旋转transform-origin:centercenter;//定位中心点transform:translate(x,y);//在x和y轴上定位transition:.1s;//过渡动画animation:obj2s;//动画border-radius:5px;//边框圆角background-size:100%100%;//背景尺寸box-show:000#000;//阴影陈词滥调答案：width:100px;//所有识别的width:100px\9;//ie6,ie7,ie8*width:100px;//ie6,ie7_width:100px;//ie6宽度:100px\0;//ie8clearfloatinganswer:.clear{zoom:1;};.clear:after{content:'';显示：块；清除：两者；}HTMLChapterhtml5加了那些标签答案：videocanvasheaderfootersectionnav有什么作用？答：让浏览器根据哪个版本来解析文档。link@import有什么区别答：link是通过html链接引入的，@import是在css文件中引入的。链接也是在页面加载的时候加载的，@import需要在css加载完成后才开始加载。lable有什么用答：标记输入，点击lable中的文字，会触发这个控件，焦点会自动转移到绑定的表单元素上。综合文章cookies、sessionStorage、localStorage有什么区别？答：Cookies：最多存储20条数据，存储大小约4kb，在设定时间前关闭浏览器不会消失，存在安全漏洞，容易被拦截，被分享在同一来源的所有窗口中。sessionStorage：大小为5M或更大，不同浏览器下和一个页面（iframe）下不共享；浏览器关闭时消失sharedWebSocket和socket有什么关系？WebSocket和ajax的区别？答：1.mmp！就像javascript和java，锤子手机和锤子一样，存在锤子关系。2.web是长连接，一直保持连接，ajax是短连接，发起，接收，关闭。Ajax由客户端发起，web在客户端和服务器之间进行推送。http和https的区别答：个人理解：https比http安全。为什么安全性未知，请自行搜索。虽然自己搜索看了好几遍，但个人一直没能看懂，所以不再标注答案。等我理解透彻了，我再写。如何在http和https之间传输？答：mmp，大家自己搜索吧。常规验证邮件回复：varstr=23246574@qq.comreg=/^\w+@\w+(\.[a-zA-Z]{2,3}){1,2}$/g;));console.log(reg.text(str));JavaScript闭包，你在开发中经常使用闭包吗？为什么？答：您可以访问另一个函数范围内的变量和函数。不建议经常使用，或者如果对自己的技术没有信心，也不要过多使用，因为闭包过多，操作不当，很容易造成内存泄漏，变成内存溢出。Datatype、Answer:numberstringbooleanundefinednullobject获取元素自定义属性有什么区别？答：getAttribute；//返回对象getparameter;//返回字符串继承有哪些？答案：原型链，组合，寄生，寄生组合，构造，实例，复制问题vararr1=[1,2,3,4,5,6,7,8,9],arr2=[9,8,7,6,5,4,3,1,11,10,7,9];找到arr1和arr2中的耦合数。将{"a":[1,2,3],"b":[4,5],"c":[6],"d":[7,8,9,10]}转换为[{"type":"a","name":1},{"type":"a","name":2},{"type":"a","name":3},{"type"":"b","name":4},{"type":"b","name":5},{"type":"c","name":6},{"type":"d","name":7},{"type":"d","name":8},{"type":"d","name":9},{"type":"d“，”名称“：10}]