常用css和js内容
1.让一个200x200的div在不同分辨率屏幕上下左右居中。
<div class="box"></div> <style type="text/css"> .box{ height: 200px; width: 200px; background: #eee; position: absolute; left: 50%; top: 50%; margin-top: -100px; margin-left: -100px; } </style>
2. 阐述清楚浮动的几种方式
(1)手动给父级div高度:height。
- 原理:父级div手动定义height,就解决了父级div无法自动获取到高度的问题。
- 优点:简单、代码少、容易掌握
- 缺点:只适合高度固定的布局,要给出精确的高度,如果高度和父级div不一样时,会产生问题
(2)父级div定义 overflow:hidden
- 原理:必须定义width或zoom:1,同时不能定义height,使用overflow:hidden时,浏览器会自动检查浮动区域的高度
- 优点:简单、代码少、浏览器支持好
(3)结尾处加空div标签 clear:both
- 原理:添加一个空div,利用css提高的clear:both清除浮动,让父级div能自动获取到高度
- 优点:简单、代码少、浏览器支持好、不容易出现怪问题
- 缺点:不少初学者不理解原理;如果页面浮动布局多,就要增加很多空div,让人感觉很不好
3.如何用原生js给一个按钮绑定两个onclick事件?
Var btn=document.getElementById(‘btn’); //事件监听 绑定多个事件 //页面加载完后执行下面代码 window.onload=function(){ var btn = document.getElementById("btn"); btn.addEventListener("click",event1); btn.addEventListener("click",event2); function event1(){ alert(11) } function event2(){ alert(22) } }
4.编写一个方法去掉数组里面 重复的内容 var arr=[1,2,3,4,5,1,2,3]
var arr = [1,2,3,4,3,5,6,4]; getNewArr(arr); function getNewArr(arr){ var newArr = []; for(var i = 0;i<arr.length;i++){ if(newArr.indexOf(arr[i]) == -1){ newArr.push(arr[i]); } } console.log(newArr) }