前端面试的基础四十小问(前20问)

2023-05-16

文章目录

    • 1.什么是HTML语义化?
    • 2.标签title与alt属性的区别是什么?
    • 3.iframe的优缺点?
    • 4.介绍一下CSS的盒子模型?
    • 5.垂直居中的几种方式?
    • 6.rgba和opacity的透明效果有什么不同?
    • 7.position的值,relative和absolute分别是对于谁进行定位的?
    • 8.HTML5,CSS3里面新增了哪些特性?
    • 9.BFC是什么?
    • 10.常见的兼容性问题?
    • 11.JS数据类型有哪些?
    • 12.判断一个值是什么类型有哪些方法
    • 13.null和undefined的区别?
    • 14.怎么判断一个变量arr是否为数组(此题用typeof不行)?
    • 15.箭头函数有哪些特点?
    • 16.new操作符具体干了什么呢?
    • 17.documen.write和innerHTML的区别?
    • 18.什么是ajax过程
    • 19.请解释一下JavaScript的同源策略?
    • 20.介绍一下闭包和闭包的常用场景

部分答案来源于官方答案和网络综合答案如有错误答案请大佬们不吝赐教。

1.什么是HTML语义化?

答:语义化的HTML就是正确的标签做正确的事情,能够便于开发者阅读和写出更优雅的代码的同时让网络爬虫很好地解析。其主要目的就是让大家直观的认识标签和属性。
对上述问题的补充:
(1)为什么要做到语义化?
答:有利于SEO,有利于搜索引擎爬虫更好的理解我们的网页,从而获取更多的有效信息,提升网页的权重。

2.标签title与alt属性的区别是什么?

答:title属性可以用在任何元素上,当用户把鼠标移动到元素上时,就会出现title的内容,起到对图片说明的作用,其实质就是对图片的一种备注或者注释 通俗来讲,alt属性的实质是通过文字来代替图片的内容,而title属性的实质是对图片的描述或者注释。

3.iframe的优缺点?

答:解决加载缓慢的第三方内容如图标和广告等的加载问题. 能并行加载脚本. 方便管理,指的是如果有多个页面需要用到iframe的内容,那么只要修改iframe的内容就可以实现统一管理. iframe可以原封不动的把嵌入的网页显示出来. 缺点. 会产生很多的页面,不容易管理. 会增加服务器的http请求对大型网址不可取.
通俗解释:
优点:
1、iframe能够原封不动的把嵌入的网页展现出来;
2、如果有多个网页引用iframe,那么只需要修改iframe的内容,就可以实现调用每一个页面的更改,方便快捷;
3、网页如果为了统一风格,头部和版本都是一样的,就可以写成一个页面,用iframe嵌套,可以增加代码的可重用;
4、如果遇到加载缓慢的第三方内容,如图标或广告,这些问题可以由iframe来解决;
5、iframe会堵塞主页面的Onload事件;
6、iframe和主页面共享连接池,而浏览器对相同域的连接有限制,所以会影响页面的并行加载
缺点:
1、iframe会阻塞主页面的Onload事件;
2、iframe和主页面共享链接池,而浏览器对相同城的链接有限制,所以会影响页面的并行加载;
3、使用iframe之前需要考虑这两个缺点,如果需要使用iframe,最好是通过JavaScript;
4、动态给iframe添加src属性值,这样可以可以绕开以上两个问题
5、不利于seo;
6、代码复杂,无法一下被搜索引擎索引到;
7、iframe框架页面会增加服务器的http请求,对于大型网站不可取;
8、很多的移动设备无法完全显示框架,设备兼容性差

4.介绍一下CSS的盒子模型?

答:1. 盒模型: 内容 (content)、填充 (padding)、边界 (margin)、 边框 (border)
2. 类型: IE 盒子模型、标准 W3C 盒子模型;
3. 两种盒模型的主要区别是:标准盒模型的宽高是值内容宽高 (content)
4. 而IE盒模型的宽高是指content+padding+border。

5.垂直居中的几种方式?

答:对已知高度块级元素进行垂直居中:
1、绝对定位,配合top:50%和负margin-top(元素高度一半)进行垂直居中;
2、绝对定位,配合top:0;bot1行垂直居中;
3、设置position:absolute;和calc()函数实现垂直居中;4、使用浮动float实现元素垂直居中;
对未知高度块级元素:
1、设置position: absolute;和tran(x,y)实现水平垂直居中;
2、居于视口单位︰通过使用margin-top: 50vh;配合transform:translateY(-50%);实现视口居中;
3、通过display:table-cell和vertical-align:middle;实现垂直居中;
4、基于flex布局

6.rgba和opacity的透明效果有什么不同?

答:rgba()和opacity都能实现透明效果,但最大的不同是opacity作用于元素,以及元素内的所有内容的透明度,而rgba()只作用于元素的颜色或其背景色。(设置rgba透明的元素的子元素不会继承透明效果!)比如,我们写透明的黑色部分都是用opcity(0.5),但这带出来一个问题就是如果你在这一div上写字的话,然后那个字体也会变成透明色。所以我们采取rgba的样式写,前面三个数字分别对应r,g,b,的三种颜色,第四位的数字对应的是透明的系数。

7.position的值,relative和absolute分别是对于谁进行定位的?

答:absolute :生成绝对定位的元素,相对于最近一级的标签属性进行定位;
relative生成相对定位的元素,相对于其在普通流中的位置进行定位
扩展:
position有几种,absolute和relative的区别
1.static(默认属性),当没有给元素设置position时默认为static
2.absolute(绝对定位),相对于父级第一个设置了position属性进行定位(没有则相对于body,static除外),top,left,bottom,right均是相对于这个父元素的偏移量
3.relative(相对定位),在元素原来的位置上进行定位,top,left,bottom,right的值相当于原来位置的偏移量
4.fixed(固定定位),相对于浏览器视口的定位,不会随着滚动条的滚动而滚动,top,left,bottom,right的值相当于浏览器窗口的定位

区别
1.absolute和relative都会使元素脱离文档流,但不同的是,absolute脱离文档流后不会占用原来的位置,而relative会在原来的位置上留下一个副本占用原来文档流的位置
2.absolute的父元素设有position时,top,left,bottom,right会忽略父级元素的padding值,即始终与父级元素的左上角进行定位,且其层级会始终比父级高,无论父级设置多大的z-index,但relative的定位会受父元素padding值影响
3.absolute是以第一个设置了position的父元素或祖先元素进行定位,而relative定位的层总是相对于其最近的父元素,无论其父元素是何种定位方式

8.HTML5,CSS3里面新增了哪些特性?

答:
HTML5:
本地离线存储localStorage
新的语义标签
长期存储数据,浏览器关闭
article 独立的内容;
后数据不丢失;
aside侧边栏;
sessionStorage的数据在浏
header头部;
览器关闭后自动删除
nav导航;
新的技术webworker,
section文档中的节;
websocket,Geolocation;
footer页脚;
拖拽释放(Drag and drop)
画布(Canvas)APl;
APl;
地理(Geolocation) APl;表单控件.calendar、date.音频、视频APl(audio,
time、email、url、searc
video);

css3:
圆角(border-radius) ,
阴影(box-shadow),
2d,3d变换;
对文字加特效(text-shadow),
Transition,
线性渐变(gradient)
animation;
旋转(transform)
媒体查询
transform:rotate(9deg)
新的单位
scale(0.85,0.90) translate
(rem,vw, vh等);
(0px,-30px)
rgba;
skew(-9deg,0deg);旋转,缩放,定位,倾斜

9.BFC是什么?

答:
Block Fromatting Context:块级格式化上下文,简称BFC;
w3C对BFC的定义︰浮动元素和绝对定位元素,非块级盒子的块级容器(例如inline-blocks, table-cells,和table-captions),以及overflow值不为"visiable"的块级盒子,都会为他们的内容创建新的BFC

10.常见的兼容性问题?

1.不同浏览器的标签默认外补丁margin和内补丁padding不同;
2.块属性标签float之后,又有横向的margin值,在IE6中显示会比设置的大;
3.设置较小的高度标签(一般小于10px),在IE6,IE7,遨游中超出自己设置的高度;
4.行内标签设置display:block;后又采用float布局,再设置横向margin值时,在IE6中显示会比设置的大;
5.图片默认有间距;
6.标签最低高度设置min-height不兼容;
7.透明度兼容设置;
8.Box Model的bug;
9.IE6中的列表li楼梯状bug;
10.li空白间距;rflow : auto:和position:relative的碰撞;
12.浮动层的错位;
13.IE6克隆文本的bug;
14.IE的图片缩放;
15.IE6 下png图片的透明bug;
16.透明背景bug;
17.禁用IE默认的垂直滚动条;

11.JS数据类型有哪些?

在JavaScript中每一个值都属于某一种数据类型。 JavaScript的数据类型共有六种。 它们分别是undefined、null、boolean、number、string、object JavaScript 只有一种数字类型。 数字可以带小数点,也可以不带 它有两个值:true和false,但需要注意的是true不一定等于1,false不一定等于0。

12.判断一个值是什么类型有哪些方法

typeof运算符,instanceof运算符,object.prototype.tostring方法

13.null和undefined的区别?

(1 ) null是一个表示”无”的对象,转我数值是为0undefined是一个表示”无”的原始值,转为数值时为NaN。当声明的变量还未被初始化时,能量的默认值为undefined;
(2)Null用来表示尚未存在的对象,常用来表示函数企图返回一个不存在的对象;
(3) Undefined表示”缺少值”,就是此处应该有-个值,但是还没有定义;
(4)null表示”没有对象”,即该处不应该有值

undefined和null的区别:. ● undefined 表示一个变量没有被声明,或者被声明了但没有被赋值(未初始化),一个没有传入实参的形参变量的值为undefined,如果一个函数什么都不返回,则该函数默认返回undefined。. null 则表示"什么都没有",即"空值"。. ● Javascript将未赋值的变量默认值设为 undefined ;Javascript从来不会将变量设为 null 。. 它是用来让程序员表明某个用var声明的变量时没有值的;.

14.怎么判断一个变量arr是否为数组(此题用typeof不行)?

1.instanceof;
2.对象的constructor属性;
3.object.prototype.tostring;
4.array对象的isarray方法(array.isarray());

15.箭头函数有哪些特点?

1.不需要function关键字来创建函数;
2.省略return关键字;
3.改变this的指向;

16.new操作符具体干了什么呢?

1.创建一个空对象;
2.链接到原型;
3.绑定this值(让func中的this指向obj,执行func的函数体);
4.返回新对象;

17.documen.write和innerHTML的区别?

documen.write是直接将内容写入页面的内容流,会导致页面全部重绘,innerhtml将内容写入某个DOM节点,不会导致全部重绘。
document.write是直接写入到页面的内容流,如果在写之前没有调用document.open, 浏览器会自动调用open。每次写完关闭之后重新调用该函数,会导致页面被重写。

innerHTML则是DOM页面元素的一个属性,代表该元素的html内容。你可以精确到某一个具体的元素来进行更改。如果想修改document的内容,则需要修改document.documentElement.innerElement,且innerHTML将内容写入某个DOM节点,不会导致页面全部重绘。
document.write是重写整个document, 写入内容是字符串的html
innerHTML是HTMLElement的属性,是一个元素的内部html内容
所以两者都可向页面输出内容,innerHTML比document.write更灵活,而innerHTML很多情况下都优于document.write,其原因在于其允许更精确的控制要刷新页面的那一个部分。

18.什么是ajax过程

1.创建XIALHttpRequest对象,也就是创建一个异步调用对象;
2.创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息;
3.设置响应HTTP请求状态变化的函数;4.发送HTTP请求;
5.获取异步调用返回的数据;
6.使用JavaScript和DOM实现局部刷新;
PS:Ajax的工作原理相当于在用户和服务器之间加了—个中间层 (AJAX引擎),使用户操作与服务器响应异步化。并不是所有的用户请求都提交给服务器,像—些数据验证和数据处理等都交给Ajax引擎自己来做, 只有确定需要从服务器读取新数据时再由Ajax引擎代为向服务器提交请求。

19.请解释一下JavaScript的同源策略?

答:同源策略是客户端脚本(尤其是Javascript)的重要的安全度量标准。它最早出自Netscape Navigator2.0,其目的是防止某个文档或脚本从多个不同源装载

概念:同源策略是客户端脚本(尤其是Javascript)的重要的安全度量标准。它最早出自Netscape Navigator2.0,其目的是防止某个文档或脚本从多个不同源装载。
这里的同源策略指的是:协议,域名,端口相同,同源策略是一种安全协议。指一段脚本只能读取来自同一来源的窗口和文档的属性。
为什么要有同源限制?
我们举例说明:比如一个黑客程序,他利用Iframe把真正的银行登录页面嵌到他的页面上,当你使用真实的用户名,密码登录时,他的页面就可以通过Javascript读取到你的表单中input中的内容,这样用户名,密码就轻松到手了。

20.介绍一下闭包和闭包的常用场景

  1. 闭包是指有权访问另一个函数作用域中的变量的函数,创建闭包常见方式,就是在一个函数的内部创建另一个函数。

  2. 使用闭包主要为了设计私有的方法和变量,闭包的优点是可以避免变量的污染,缺点是闭包会常驻内存,会增大内存使用量,使用不当很容易造成内存泄露。
    在js中,函数即闭包,只有函数才会产生作用域的概念。

闭包有三个特性:
函数嵌套函数
函数内部可以引用外部的参数和变量
参数和变量不会被垃圾回收机制回收
应用场景,设置私有变量的方法
不适用场景:返回闭包的函数是个非常大的函数
闭包的缺点就是常驻内存,会增大内存使用量,使用不当会造成内存泄漏

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

前端面试的基础四十小问(前20问) 的相关文章

  • PHP四种设计模式

    1php常见开发模式 xff1a 1 单列模式 2 工厂模式 3 观察者模式 4 策略模式 2设计模式实例 1 单例模式 单例模式顾名思义 xff0c 就是只有一个实例 作为对象的创建模式 xff0c 单例模式确保某一个类只有一个实例 xf
  • CAN总线基础知识(一)

    1 xff0e CAN总线是什么 xff1f CAN xff08 Controller Area Network xff09 是ISO国际标准化的串行通信协议 广泛应用于汽车 船舶等 具有已经被大家认可的高性能和可靠性 CAN控制器通过组成
  • 【ROS Gazebo专题】二、Gazebo的使用上

    跳的比较快 xff0c 别人光介绍基础以及ros的基本操作就写了十几二十篇 xff0c 我一下就跳到了Gazebo这 xff0c 可怕有没有 其实原因很简单 xff0c 如果你将ros官网的基础篇章练习完了 xff0c 在最后一篇 wher
  • 程序员也该懂点UI细节

    虽然说项目开发过程中 xff0c 美工和程序各司其职 但是很多时候程序员本身也要知道一些UI设计的细节 一 每个页面的功能上要突出重点 比如说你首页是想引导更多用户注册的话 xff0c 你就要把注册按钮突出出来 如果你首页是你想引导用户更快
  • ftp 客户端软件的传输模式ASCII和二进制

    FTP可用多种格式传输文件 xff0c 通常由系统决定 xff0c 大多数系统 包括UNIX系统 只有两种模式 xff1a 文本模式和二进制模式 文本传输器使用ASCII字符 xff0c 并由回车键和换行符分开 xff0c 而二进制不用转换
  • 一步一步定制自己的google map(各个省市的经纬度查询)

    安徽省 合肥 北纬31 52 东经117 17 安徽省 安庆 北纬30 31 东经117 02 安徽省 蚌埠 北纬32 56 东经117 21 安徽省 亳州 北纬33 52 东经115 47 安徽省 巢湖 北纬31 36 东经117 52
  • 网页刷新或者重新加载后滚动条的位置不变

    在开发的过程中我们经常需要重新加载或者刷新某个画面 xff0c 已确保数据显示是最新的 但是如果一丁点改变就刷新画面的话 xff0c 会导致用户体验很差 xff0c 想想看你好不容易把网页拖到最后 xff0c 结果点击某个按钮的时候 xff
  • 番茄工作法(番茄钟时间管理)

    番茄工作法是我一次偶然的时间在网上看到的 xff0c 因为自己性格大大咧咧 丢三落四 xff0c 所以经常容易在时间问题上犯迷糊 很多人都有时间拖沓症 xff0c 就是一件事不到最后阶段不去解决它 比如你有一个星期的时间写的毕业论文 xff
  • jquery中美元符号($)命名冲突

    在Jquery中 xff0c 是JQuery的别名 xff0c 所有使用 的地方也都可以使用JQuery来替换 xff0c 如 39 msg 39 等同于JQuery 39 msg 39 的写法 然而 xff0c 当我们引入多个js库后 x
  • Django的密码操作

    一 关于密码操作的思维导图 二 修改密码内置函数源码 64 sensitive post parameters 64 csrf protect 64 login required 64 deprecate current app def p
  • js实现省市联动

    效果图如下 xff1a 思路很简单 xff0c 就是先加载省信息 xff0c 然后当省改变的时候加载市县信息 烦的是数据的录入 xff0c 代码如下 lt DOCTYPE html PUBLIC 34 W3C DTD XHTML 1 0 T
  • 正则在小偷程序中的应用(续)

    获取资源信息 content 61 file get contents 34 http list sososteel com qg list html pg 61 1 amp h 61 34 time 对抓取的信息进行处理 取class为l
  • mysql密码过期问题解决方案

    mysql密码过期问题解决方案 问题再现 xff1a 密码过期 旧电脑许久没有用 xff0c 今天打开发现数据库连接不上了 提示密码过期 xff0c 请修改密码 ERROR 1862 HY000 Your password has expi
  • Fast RTPS(DDS) 安装指南

    Foonathan Memory 在构建 Fast DDS 之前 xff0c 需要先安装 Foonathan Memory 依赖 span class token function git span clone https github c
  • ubuntu的两种软件安装方式

    第一种 xff1a sudo apt get install xxxxxxx 第二种 xff1a sudo dpkg i xxxx deb 参考文章
  • Ethernet下字节序和bit序的总结

    Ethernet下字节序和bit序的总结 本文讲述的是在ethernet中多字节数据发送时涉及到字节序和bit序的剖析 关于字节序 大小端 和bit序 xff0c 以及MSB和LSB的叙述 xff0c 请另行学习 xff0c 本篇不涉及 正
  • C++ 智能指针 unique_ptr 详解与示例

    unique ptr 是 C 43 43 11 提供的用于防止内存泄漏的智能指针中的一种实现 xff0c 独享被管理对象指针所有权的智能指针 unique ptr对象包装一个原始指针 xff0c 并负责其生命周期 当该对象被销毁时 xff0
  • ECMAScript 6 中的数组方法 - forEach

    let colors 61 red blue green es5 遍历数组的方法 span class hljs keyword for span let span class hljs keyword index span 61 span
  • ECMAScript 6 中的数组方法 - map

    span class hljs variable span 场景 span class hljs number 1 span 假设有一个数字数组 xff08 a xff09 xff0c 奖a数组中的值一双倍的形式放到b数组 span cla
  • 写在Paper Reading之前

    写在Paper Reading 之前 2016年第一篇文章 xff0c 就以paper reading开头 xff0c 这段时间最少写五篇 xff0c 达到申请专栏的条件 通过申请专栏 xff0c 也可以达到监督作用 xff0c 催促自己多

随机推荐

  • C++进程PID编程

    一 获取pid t的字节长度 1 代码 include lt iostream gt using namespace std int main int argc char argv pid t pid cout lt lt 34 sizeo
  • 异常检测——集成学习

    Ensembles for Unsupervised Outlier Detection Challenges and Research Questions 首先 xff0c 知道一个模型好不好 xff08 精确不 xff09 外部指标内部
  • Centos 防火墙

    一 对于centos7自带的防火墙的相关指令 systemctl stop firewalld service 停止firewall systemctl disable firewalld service 禁止firewall开机启动 sy
  • MissionPlanner编译流程及问题详解

    MissionPlanner编译流程及问题详解 一 xff0c 介绍 MissionPlanner是一款基于C 开发的开源的地面站软件 xff0c 主要用在Windows Linux平台 MP使用广泛 xff0c 提供了较为完善的功能 xf
  • 学术论坛第三期:多指标异常检测方法综述

    学术论坛 第三期 推荐阅读时长 xff1a 13min 前言 朋友们 xff01 本期内容干货满满 xff01 参考文献引用30余篇 xff01 xff01 答应我这篇文章一定要看 xff01 xff01 xff01 本期论坛我们邀请中国人
  • 数据平台与Flink任务运行原理介绍

    本文将从5个方面详细介绍数据平台大数据任务开发的基础知识 包含数据平台的简介 如何在平台内创建Flink表 如何编写Flink大数据处理作业 Flink任务启动时的调用流程以及Flink web UI 任务监控页面 此外 xff0c 将重点
  • vue中模板和组件分离

    vue中模板和组件分离 第一种 xff1a 使用script xff0c 将其类型跟改为text x template 代码示例如下 xff1a span class token operator lt span span class to
  • vue中的生命周期(钩子函数)

    vue中的生命周期 xff08 钩子函数 xff09 下图是整个vue的生命周期 生命周期共有八个钩子函数 生命周期 xff1a vue是一个构造函数 xff0c 执行这个函数的时候 xff0c 即相当于实例化了这个函数 xff0c 因此我
  • paddle的两阶段基础算法基础

    paddle的两阶段基础算法详解与实践 有三部分分别是 xff1a 1 xff0c 两阶段算法发展历程 2 xff0c Faster R CNN原理解析 3 xff0c Paddle Detection实战演练 一 xff1a 两阶段算法的
  • Faster R-CNN网络架构

    Faster R CNN网络架构原理解析 Anchor的第一个分支是一个分类分支负责判断途中有没有东西 xff0c 但是不会判断物品 第二个分支是回归分支表示Anchor和真实值有多远最终提取的候选框尽量向真实值靠拢 RPN层是如何提取候选
  • Faster R-CNN原理详解

    Faster R CNN原理详解 首先将RPN输出以及将anchor解码 xff0c 然后对预测框进行clip xff0c 然后对预测狂进行过滤 xff0c filter将面积太小的过滤掉 xff0c 然后将分数较低的去掉 xff0c NM
  • linux出现“INFO: task xxxxxx: 634 blocked for more than 120 seconds.”的3种解决方案

    1 问题描述 最近搭建的一个linux最小系统在运行到241秒时在控制台自动打印如下图信息 xff0c 并且以后每隔120秒打印一次 仔细阅读打印信息发现关键信息是 hung task timeout secs xff0c 第一次遇到这样的
  • vue中的计算属性和侦听器

    vue中的计算属性和侦听器 computed xff08 计算属性 xff09 在模板中放入太多的逻辑不但难以维护 xff0c 就连作者自身在看到代码的时候可能都难以理解 vue开发了计算属性 xff0c 计算属性是依赖于本身的响应式以来进
  • vue-列表的渲染

    vue 列表的渲染 vue的列表渲染指令是基于v for的 xff0c 官方文档中是这么说的 v for 指令需要使用 item in items 形式的特殊语法 xff0c 其中 items 是源数据数组 xff0c 而 item 则是被
  • vue-事件处理

    vue 事件处理 一般使用v on来进行事件监听 xff0c 在监听DOM事件时会触发一部分的js代码 使用v on xxx或 64 xxx绑定事件 xff0c xxx指 事件名 事件的回调要写在methods对象中 xff0c 最终会放在
  • R-CNN算法优化策略

    R CNN算法优化策略 1 xff0c 两阶段检测的进阶模型 首先进行数据处理 xff0c 然后输入backbone得到特征图 xff0c 然后进入RPN中提取候选区域roi xff0c 然后再ROI Align提取特争 xff0c 然后送
  • 一篇文章让你从入门到彻底学会Java

    一篇文章让你从入门到彻底学会Java 文章目录 一篇文章让你从入门到彻底学会Java第一个Java程序 43 基础知识详解Java的对象和类Java中的数据类型Java变量类型Java运算符Java中的循环Java 条件语句Java中的sw
  • vue-进入/离开&列表过渡

    vue 进入 离开 amp 列表过渡 在 CSS 过渡和动画中自动应用 class可以配合使用第三方 CSS 动画库 xff0c 如 Animate css在过渡钩子函数中使用 JavaScript 直接操作 DOM可以配合使用第三方 Ja
  • vue中的路由基础

    vue中的路由 在使用vue router之前 xff0c 首先需要安装该插件 首先在cmd中使用npm install vue router进行插件的安装 xff0c 如果要在工程项目中使用它必须通过Vue use 明确地安装路由功能 就
  • 前端面试的基础四十小问(前20问)

    文章目录 1 什么是HTML语义化 xff1f 2 标签title与alt属性的区别是什么 xff1f 3 iframe的优缺点 xff1f 4 介绍一下CSS的盒子模型 xff1f 5 垂直居中的几种方式 xff1f 6 rgba和opa