前端题目

说一说BFC

BFC就是一个相对封闭的容器，而这个容器内部的盒子布局不会影响到容器外边的盒子布局。常用来解决外边距折叠，和高度坍塌的问题

说一说css样式优先级的规则是什么？

超然地位：!important（只要我出现，不好意思，权重就是无限，优先考虑，别的靠边站）

内嵌样式（行内）>ID选择器>类选择器>标签选择器，

权重计算:(0,0,0,0)顺序是：行内，id，类，标签

但是开发中不建议使用    ！important

说一下浮动？

浮动最早是用来解决文字环绕图片效果的。

1、浮动的元素会脱离标准流相当于飘到了空中在标准流中就不占位置

2、浮动的元素有特殊的显示效果，一行可以显示多个，可以设置宽高

说一说HTML语义化？

HTML语义化可以提升用户体验，有利于SEO和搜索引擎建立良好沟通，使代码更具可读性，便于团队开发和维护。

未知宽高元素水平垂直居中方法

设置元素相对父级定位'position：absolute;top：50%;left：50%'，

/*向下移动父级高度的50%*//*向右移动父级宽度的50%*/

让自身平移自身高度50% 'transform： translate（-50%，-50%）;

/*向上、向左移动自身高度、宽度的50%,即完成了*/

（这种兼容性方式好，被广泛使用的一种方式）

说一说css盒模型

一个盒子由外到内可以分成四个部分：margin（外边距）、padding（内边距）、border（边框）、content（内容）。

盒子设置的padding（内边距）或者的border（边框）会撑大盒

可以添加内减模式（自动内减）：box-sizing:border-box

说一说JS数据类型有哪些

数字、字符串、布尔值、空值、未定义、对象

JS数据类型分为两类：

一类是基本数据类型，也叫简单数据类型，包含5种类型，分别是Number（数字型） 、String（字符串型）、Boolean（布尔值型）、Null（空值）、Undefined（未定义）。

另一类是引用数据类型也叫复杂数据类型，通常用Object代表，普通对象，数组，正则，日期，Math数学函数都属于Object。

数组去重的方法

indexOf(数组元素)  如果返回时 -1 就说明 新数组里面没有改元素

Push-添加元素

先设一个新的空数组

然后用for循环遍历对象的数组元素，再然后用if，如果新数组的indexOf（原数组的第【i】个）全等于-1，那么新数组添加原数组的第【i】个。

JS变量提升

变量提升是指JS的变量和函数声明会在代码编译期，提升到代码的最前面。

变量提升成立的前提是使用Var关键字进行声明的变量，并且变量提升的时候只有声明被提升，赋值并不会被提升，同时函数的声明提升会比变量的提升优先。

块级元素、行内元素、行内块元素的区别

块级元素：display：block

        1、独占一行

        2、宽度默认占满一行，高度默认由内容撑开

        代表标签  div、p、 h系列标签

行内元素：display：inline

        1、一行可以显示多个

        2、宽度和高度默认都是由内容撑开

        3、不可以设置宽高！！！

       代表标签 a、span

行内块元素：display：inline-block

        1、一行可以显示多个

        2、可以设置宽高

        代表标签： input

特殊情况： img标签有行内块元素的特点，但是调试工具中显示默认显示模式为inline

绝对定位和相对定位的区别

1.相对定位：position: relative;（占位置）

相对于原来位置移动，元素设置此属性之后仍然处在文档流中，不影响其他元素的布局。

2.绝对定位：position: absolute;（不占位置）

元素会脱离文档流，如果设置偏移量，会影响其他元素的位置定位

在父元素没有设置相对定位或绝对定位的情况下，元素相对于根元素定位（即html元素）（是父元素没有）。

父元素设置了相对定位或绝对定位，元素会相对于离自己最近的设置了相对或绝对定位的父元素进行定位（或者说离自己最近的不是static的父元素进行定位，因为元素默认是static）。

口诀：子绝父相