前端面试题

最新推荐文章于 2023-02-08 22:55:37 发布

zxz32384

最新推荐文章于 2023-02-08 22:55:37 发布

阅读量255

点赞数

分类专栏：笔试&面试

本文链接：https://blog.csdn.net/u013993319/article/details/52548900

版权

笔试&面试专栏收录该内容

2 篇文章 0 订阅

订阅专栏

1、 js 用闭包实现输出1-20, 实现每两秒输出一个数。主要考点：闭包怎么保存变量。

闭包，简单点说就是函数里面包含函数，闭包可以实现子函数调用父函数的中声明的变量，而父函数则不能调用子函数中的变量。

for（var i=0;i<=20;i++）{
 (function (a){
   setTimeout(function(){
  console.log(a)},a*1000)})(i)
}

2、布局实现删格系统不用bootstrap,一行四列平均分布，每列之间间隔20px，最左边和最右边没有空隙。（考点：margin的负值，css盒模型的转换）

.row{
width:100%;
margin-left:-10px;
margin-top:-10px;}
.col{
box-sizing:border-box;
width:25%;
margin:10px 0;}

3、用CSS画一个三角形（border）

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>文档</title> 
<style>
p 
{
width:0px;height:0px;
border:20px solid transparent;
border-left-color:red;
}
</style>
</head>

<body>
<p></p>
</body>
</html>

使用伪类画三角形

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"> 
<title>菜鸟教程(runoob.com)</title> 
<style>
div{
	position:relative;
}
	p{
	width:100px;
	height:100px;
	border:1px solid #ccc;
	}
p:after,p:before
{
	content:"";
	position:absolute;
	top:40px;
	left:100px;
    width:0px;height:0px;
    border:10px solid transparent;
    border-left-color: rgb(255,255,255);
}
	    p:before{
            top: 39px;
            border: 11px solid transparent;
            border-left-color: #ccc;
        }
</style>
</head>

<body>
	<div>
       <p></p>
	</div>
</body>
</html>

效果如下图：

zxz32384

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
前端面试题

闭包，简单点说就是函数里面包含函数，闭包可以实现子函数调用父函数的中声明的变量，而父函数则不能调用子函数中的变量。for（var i=0;i (function (a){ setTimeout(function(){ console.log(a)},a*1000)})(i)}
复制链接

扫一扫

专栏目录