一、css中position有几种,分别是什么?
absolute、relative、fixed、static
1、static:默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)。
2、relative:生成相对定位的元素,通过top,bottom,left,right的设置相对于其正常位置进行定位。可通过z-index进行层次分级。
3、absolute:生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
4、fixed:生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。可通过z-index进行层次分级。
二、Div居中的几种方式?
1、 div#container { margin-left: auto; margin-right: auto; width: 168px; } 2、 body{ text-align:center; } 3、 body { text-align:center; } #wrap { text-align:left; margin:0 auto; } 4、 div{display: inline-block;} div {display:inline;}
三、div并排同行显示
1、适合div和ul等其他element div {float:left;} 2、适合div和ul等其他element div {display: inline;}
四、js定义一个class
1、 function Cat() { this.name = "大毛"; } var cat1 = new Cat(); alert(cat1.name); // 大毛 2、 Cat.prototype.makeSound = function(){ alert("喵喵喵"); } 3、 var Cat = { name: "大毛", makeSound: function(){ alert("喵喵喵"); } }; var cat1 = Object.create(Cat); alert(cat1.name); // 大毛 cat1.makeSound(); // 喵喵喵 4、 var Cat = { createNew: function(){ var cat = {}; cat.name = "大毛"; cat.makeSound = function(){ alert("喵喵喵"); }; return cat; } }; var cat1 = Cat.createNew(); cat1.makeSound(); // 喵喵喵
五、js闭包作用
function f1(){ n=999; // 定义一个闭包 function f2(){ alert(n); } return f2; } var result=f1(); result(); // 999闭包就是能够读取其他函数内部变量的函数。
闭包的用途
闭包可以用在许多地方。它的最大用处有两个,一个是可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。
六、jQuery链表原理及实现
如果我们这样写$('#id').find('.className'),那程序只这样执行 的,第一次init的时候执行一步getElementById,就return了,接着执行 find('.className',divDocument),divDocument就是我们第一次选择的是div标签,如果document下有很 多dom对象的时候,这次只遍历divDocument是不是少了很多次,而且在第一次选择id的速度也要比遍历快的多。
七、bootstrap三角形的绘制
.dropdown-menu::before { content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #CCC; position: absolute; top: -7px; left: 9px; } .dropdown-menu::after { content: ''; display: inline-block; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid white; position: absolute; top: -6px; left: 9px; }
八、Css的hack
[*+><] | √ | √ | X | X | X | X |
_ | √ | X | X | X | X | X |
\9 | √ | √ | √ | X | X | X |
\0 | X | X | √ | X | √ | X |
@media screen and (-webkit-min-device-pixel-ratio:0){.bb {}} | X | X | X | X | X | √ |
.bb , x:-moz-any-link, x:default | X | √ | X | √(ff3.5及以下) | X | X |
@-moz-document url-prefix(){.bb{}} | X | X | X | √ | X | X |
@media all and (min-width: 0px){.bb {}} | X | X | X | √ | √ | √ |
* +html .bb {} | X | √ | X | X | X | X |
游览器内核 | Trident | Trident | Trident | Gecko | Presto | WebKit |
div{ height:32px; background-color:#f1ee18;/*所有识别*/ .background-color:#00deff\9; /*IE6、7、8识别*/ +background-color:#a200ff;/*IE6、7识别*/ _background-color:#1e0bd1;/*IE6识别*/ } @-moz-document url-prefix(){div{background-color:#00ff00;}}/* 仅firefox 识别 */ * +html div{background-color:#a200ff;}/* 仅IE7 识别 */ @media screen and (-webkit-min-device-pixel-ratio:0){div{background-color:#f1ee18}}{} /*safari(Chrome) 有效 */ @media all and (min-width: 0px){ div{background-color:#f1ee18;/*opera and Safari(Chrome) and firefox*/ background-color:#4cac70\0;}/* 仅 Opera 有效 */ }{}
九、css伪类选择器
http://www.w3school.com.cn/cssref/css_selectors.asp
十、css多元素的组合选择器
选择器 | 描述 | CSS版本 |
E,F | 多元素选择器,同时匹配所有E元素或F元素,E和F之间用逗号隔开 | |
E F | 后代元素选择器,匹配所有属于E元素后代的F元素,E和F之间用空格分隔 | |
E>F | 子元素选择器,匹配所有E元素的儿子元素F | |
E+F | 毗邻元素选择器,匹配所有紧随E元素之后的同级元素F | |
E~F | 匹配任何E标签之后的同级F标签 | 3 |
十一、js==或===的区别
1. ==会把比较的二者进行类型转换:
如:0 == false; // true, 会把0转成bool值进行比较
1 == true; // true, 同样把1转成bool值再和true进行比较
2. ===是不会把比较的二者进行类型转换,是string就是string,是number就是number
如: 0 === false; // false, 因为0是number,false是boolean,两者就肯定不相等
1 === true; // false
十二、js对象非空判断
var exp = null; if (!exp && typeof(exp)!="undefined" && exp!=0) { alert("is null"); }
相关推荐
前端工程师面试题
前端工程师面试题题及答案全面综合.pdf
前端工程师面试题库,考察css\html ,js http协议 rfc规范
2021阿里前端工程师面试题手册.rar
前端工程师,阿里面试手册
4. 实现不使用 border 画出1px高的线,在不同浏览器的标准模式与怪异模式下都能保持一致的效果 2. CSS3有哪些新特性 5. canvas 如何绘制
前端工程师面试题手册(2).pdf
前端工程师面试手册
这是一份关于前端工程师的笔试面试题总汇。
2021前端面试手册大全
包含了所有的前端面试的面试题,你只需要把这些背过,那么面试是一件容易的事情。
WEB前端开发工程师面试题
初中级别工程师面试题部分整理
前端工程师面试题手册.pdf
阿里2016前端开发工程师面试及答案,从别的HR那里搞到的,放心使用
自己整理的 带答案 不错 分享给大家 题目较少 精品 比较典型 是自己公司曾经面试别人的试题
《前端面试宝典》是一本由前端工程师创作的书籍,主要内容是关于前端面试相关的知识点和经验分享1。 《前端面试宝典》主要内容包括: 前端基础知识,如HTML、CSS、JavaScript等。 前端进阶知识,如ES6、HTTP协议、...
前端工程师面试题手册(1).pdf
前端春招秋招/前端工程师面试全集