面试总结归纳 #1

这篇文档总结了最基础的问题了 包含了HTML CSS GIT

1.块级元素 行内元素 行内块元素的区别是什么?
答：首先块级元素单独成行,align有效,行内元素和行内块与其他行内元素行内块共用一行,align无效

2.CSS的特点是什么?
答：1.继承性:外层标签会被内层使用 2.层叠性:定义多种样式时不会冲突 3.优先级:内联,内部,外部样式 4.调整默认优先级:!important

3.CSS的基础选择器有哪些?
答：1.通用选择器*  2.标签选择器 3.id选择器  4.类选择器class  5.群组选择器,逗号链接  6.后代选择器 7.子代选择器 8.伪类选择器

4.overflow 是什么? 有哪些属性?
答：overflow是当元素内容溢出时的处理,1.hidden溢出隐藏  2.scoll只要溢出都添加滚动条  3.auto只有溢出才增加滚动条 4.overflow-x(y)单独设置轴是否添加

5.boxshadow 是什么? 有哪些属性?
答：添加阴影 boxshaow：水平偏移 垂直偏移 模糊程度px 阴影大小px 颜色 inset内部阴影;

6.outline 是什么? 有哪些属性?
答：轮廓,一般去除元素轮廓 outline:0;  outline:width style color;

7.讲讲盒子模型以及盒子模型的计算方式?
答：盒子模型也称为框模型,是指元素在页面占地大小的计算方式,包含了内容,内边距,边框,外边距,boxsizing属性可以改变框模型的计算方式：
box-sizeing:1.content-text 是默认的框模型计算方式 2.border-box 是左右外边距+设置的width 

8.怎么解决外边距的溢出问题?
答:特殊情况下,子元素的上外边距或作用到父元素上了,可以父元素的第一个子元素上添加table,对父元素的伪类::before的display属性为table

9.背景的样式有哪些?
答：1.color 颜色  2.image 背景图片 3.repeat 平铺 4.position:x y 定位  5.size 尺寸 6.attachment 固定 

10.渐变分哪几种?
答：background-image:  1.linear-gradient 线性渐变  2.radial-gradient 径向渐变  3.repeation-linear(radial)-gradient 线性,径向重复渐变

11.字体的属性有哪些?
答：font  1.size大小  2.family系列  3.weight:bol加粗,bolder更粗,lighter细  4.style：italic斜体 5.variant:smll-caps 大型小写字母

12.文本的属性有哪些?
答： 1.color 颜色 2.text-align 水平对齐 3.line-height 行高 4.decoration 线条 5.text-indent 首行缩进 6.text-shadow 文本阴影

13.表格有哪些属性?
答：table中尺寸,背景,边框,文本,内外边距都生效,td/th在table中上面的都不生效,vertical-align设置垂直对齐方式

14.什么是定位?
答：就是控制元素在页面中的像是位置

14.有哪几种定位的方式?
答：1.普通流定位:就是元素默认的定位方式
	2.浮动定位：让块级元素水平排列,给元素加上float属性,浮动元素会在浮动方向上展位,元素一旦浮动,如果这个元素没定义宽,浮动之后靠内容撑开,一旦浮动了,就变成块级了,也脱离文档流了
	元素只要设定了position 这个元素就会称为定位元素,会解锁4个属性和一个堆叠属性
	3.相对定位: relative 不脱离文档流,相对于自己原本所在的位置偏移
	4.绝对定位: absolute 脱离文档流,后面的元素上前补位,没有定义宽度,靠内容撑开
	5.固定定位：fixed 脱离文档流,永远在可视区域不懂
	6.堆叠属性： z-index 

15.什么是脱离文档流?
答:元素脱离文档流之后,将不再在文档流中占据空间，而是处于浮动状态,脱离文档流的元素的定位基于正常的文档流，当一个元素脱离文档流后，依然在文档流中的其他元素将忽略该元素并填补其原先的空间

16.高度坍塌是什么?怎么解决?
答:一个div没有定义高度,内部所有元素都浮动,会导致默认文档流找不到高度,撑不开,最好的解决方法在父元素上添加伪类after设置clear:both;content="",display:block就可以解决

17.display显示方式有哪些属性?
答：1.inline 行内元素显示  2.block 块级元素显示 3.inline-block 行内块显示  4.table 表格方式显示  5.none 脱离文档流隐藏

18.visibility:hidden 和 display:none 区别是什么?
答：display:none 脱离文档流,隐藏看不见 ;visibility:hidden 隐藏,但是会占据页面的空间

19.如何让一个div水平垂直居中?
答：设置绝对定位absolute,left50%,top50,margin-left:这个div宽的一半 margin-top:这个div高的一半

20.css3有哪些新特性?
答：Rgba和opcity复杂属性选择器,边框,圆角,背景,渐变,2D,3D转换,过渡,动画,弹性布局等等...

21.复杂选择器都有哪些?
答：1.兄弟选择器 ~ +  2.属性选择器 [属性]  3.伪类选择器 :link未访问 :visited访问 :hover鼠标 :active激活 :focus获取焦点 :target目标激活 first-child last-child 第一个 最后一个子元素 nth-child(n) n个元素  :...  4.内容生成::before  元素内容前添加伪元素, ::after元素后添加伪元素

22.弹性布局是什么?
答:在父元素上设置display:flex称为弹性容器,容器内部的子元素都按照弹性布局,项目的排列方向,我们称为主轴,默认主轴在左侧,主轴的方向可以通过flex-direction来调整,flex-wrap调整换行,just-content主轴的对齐方式,align-items设置交叉轴上的对齐方式,order项目在主轴的排列顺序,align-self调整交叉轴的对齐方式

23.CSS3转换是什么?
答：转换可以对元素进行移动,缩放,转动,拉长等操作,设置transform 2D的转换 位移translate ,缩放scale,旋转rotate,倾斜skew,3D的转换 rotatex y z 3d 属性

24.过渡是什么?
答：是元素从一种样式逐渐改变为另一种的效果,支持颜色 数值为数字的属性 阴影 转换,trankstion-property属性,duration 持续时长,timing-function 时间曲线函数,delay 过渡延迟时间 

25.讲一讲动画?
答：设置@keyframes 动画名字 然后定义动画：animation-name 动画名称 duration 设置动画持续时间  timing-function 时间曲线函数 delay 动画延迟,animate 库也是用这个方法一样,引入以后在animation-name中写入库中需要动画的名字

26.CSS如何优化?
答：首先优化的目的就是减少服务器的压力,提升体验,尽量减少http请求的个数,多使用精灵图设置,合并样式,简写方式,避免出现多余的src和href,代码压缩

27.CSS reset 是什么?
答：不同浏览器对同一份的解析样式不同,所以我们在开发之前进行统一：1.*{margin:0;padding:0} 2.统一设置一套值 因为css reset没有标准 所以快捷的方式就是使用normalize.css添加了不同浏览器的兼容性

28.解释一下CSS sprites 以及你要如何在网页或者网站中使用?
答：其实就是把网页中的一些背景图片整合到一张文件去用,再利用background-position repeat image 组合进行定位

29.你用过栅格系统吗?
答：bootstap 流式栅格布局,对于简单的布局来说比较好用,一行12列,更好的控制元素之间的分配

30.你用过媒体查询,或针对移动端的布局/css吗?
答：媒体查询,就是响应式布局,通过不同设备类型和条件定义样式规则,语法结构 @media 设备名字 and (max-width:575.99px) {}

31.你认为bootstap最好用的是什么?
答：btn按钮,响应式的浮动,栅格布局,弹性布局的封装,以及按钮,下拉,导航等组件.

32.CSS的缺点是什么?
答：语法不够强大,没有合理的代码复用机制,代码难维护

33.scss 是什么?
答：强化辅助工具,在CSS基础上添加变量,嵌套,混合,导入,函数,指定功能,scss运行在后台,把scss转换成css文件,传递给前台

34.什么是git?
答：版本控制的一个工具,可以合并代码,提交代码,保存多个代码版本,随意切换

35.git常用的命令有什么?
答: status 查看仓库状态 add暂存区  commit 提交本地  log 验证是否在本地  branck 查看分支,
git clone xxx拉取网络仓库的内容 

36.讲一讲ajax?
答：ajax本质是js提供的异步对象,异步的向服务器发送请求,接收响应回来的数据,4步,创建XMLHttprequest对象,用异步对象调用方法,创建请求,
用异步对象,调用方法,发送请求,用异步方法,调用,接收响应

37.什么是跨域?怎么解决跨域?
答：一个网站内的网页,去请求另一个域名下的网站的资源,浏览器禁止xhr对象发送跨域的ajax请求,同源策略,解决方法,cors方式,请服务器端根据客户端的需要响应地址保持一致,如果不同域名地址都要访问同一个服务端,在origin中写入*号,JSONP方式,将服务器端要返回的结果,填充进一条可执行JS语句中返回,客户端,不要发送ajax请求,而是用script发送请求,

38.数组中有哪些常用的API?
答：push末尾追加元素,pop末尾删除元素,indexOf返回出现的位置,sort排序,shift删除第一个元素, unshift追加第一个元素