记第一天面试

@记第一天面试

欢迎使用Markdown编辑器

10.16这是我第一个面试

第一个面试

刚进公司看到了各种培训成果意识到这是一个培训机构,但是还是把面试过完了.一共面试了三个问题

1. HTML是如何渲染的
   这第一个就把我问住了
   页面渲染都是浏览器的工作。
   大致分为以下几步：
   加载：根据请求的URL进行域名解析，向服务器发起请求，接收文件（HTML、JS、CSS、图象等）。
   解析：对加载到的资源（HTML、JS、CSS等）进行语法解析，建议相应的内部数据结构（比如HTML的DOM树，JS的（对象）属性表，CSS的样式规则等等）
   渲染：构建渲染树，对各个元素进行位置计算、样式计算等等，然后根据渲染树对页面进行渲染（可以理解为“画”元素）
   这几个过程不是完全孤立的，会有交叉，比如HTML加载后就会进行解析，然后拉取HTML中指定的CSS、JS等。

我自己的理解是在用户对一个页面发起访问请求时,通过解析url对服务器发起请求,然后就接受文件.对文件中的各种标签进行解析
解析html文件,构建dom树
解析css,形成css对象模型
将css和html结合形成页面布局
最后解析javascaript形成功能

2.闭包
闭包就是在内函数调用外函数的作用域

funcation aaa(){
	let a = 1;
	function bbb(){
	console.log(a);
	}
	ruturn b;
}

3关于vue的忘记是什么问题了

第二家是电话面的,应该是个挺正规的公司问题很全面
盒子模型有哪几种

1. css盒子模型(box model)
   margin(外边距) padding (内边距) border(边框) content(内容)

2. 标准盒子模型(w3c盒子模型)
   标准盒子模型

变成w3c盒子需要的代码:box-sizing:concent-box;(元素默认)
标签实际宽度=border宽度+padding宽度+设置的宽度

怪异盒子模型(ie盒子模型)

变成怪异盒子需要的代码:box-sizing:border-box;
标签的宽度=设置的宽度
如果设置了padding和border就是从设置的实际宽高中减去，
减去后才是内容的宽高。
内容的宽度=设置的宽度-border宽度-padding宽度

行内元素和块级元素有哪些,有什么不同

行内元素: <span>  <a> <br/> <i>  <em> (i   em  是都表示斜体) <label>(扩大<input>标签的使用范围)  <strong>

块级元素
<div>  <ul> <li> <ol> <p1>....<p7> <table> <ul> <dl>

行内元素和其他元素都在同一行上不可以设置宽高
块级元素可以单独一行,每一个块级元素都是单独的一行,可以设置padding magin

行内块元素:<input> <img> <td>

行内块元素是又有块级元素又有行内元素特点的标签
可以和其他元素在同一行,又可以设置内边距和外边距

display:online  // 转换成行内元素
display:block  //转换成块级元素
display:online-block //转换成行内块

css3的新特性
1.css3中的选择器

E:last-child; //匹配父元素中之后一个子元素E:
E:nth-chlid(n);  //匹配父元素中第n个子元素E;
E:nth-last-chlid(n);//匹配父元素中倒数第n个子元素E;

2.圆角

.box{
		border-radius:15px;
		}

3.@font-face 特性
可以用来加载样式,还可以加载服务器端的字体样式,即使客户端没有这种字体也可以使用.

@font-face {
                font-family: iconfont;  //规定元素的字体系列
                src: url(//at.alicdn.com/t/font_1465189805_4518812.eot);
                //使用淘宝网字体        
}

4.渐变效果
渐变分为两种 线性渐变(linear gradients)向下/向上/向左/向右/对角方向(默认由上到下)
径向渐变(radial gradients) 由他们的中心定义

backgound-image:linear-gradients(to right,red,yellow);
//线性渐变,从左到右  to right  
background-image:radial-gradients(red 15%,yellow 25%,green 60%);

5.2D 3D动画

css弹性盒子
flex布局
如何让子元素在父元素中居中
将父元素定义为弹性盒子

display:flex;//让子元素在父元素中居中无需布局

---

定位有哪几种属性
position定位 默认值static没有定位
绝对定位 absolute 相对于static定位以外的第一个父元素进行定位
固定定位 fixed 相对于浏览器窗口进行定位
相对定位 relative 相对于正常位置进行定位
继承从父元素的定位 inherit
为什么要清除浮动？怎么清除浮动？
使用float浮动后子元素虽然实现了水平方向的浮动后,但是父元素的高度有时候会塌陷,浮动会导致属性不能正常传递.
如何清除
1.首先清除css父级的高度.
2 利用clear:both属性进行清除浮动.
3 对父级css选择器定义一个overflow:hidden ,既可以清除父级产生的浮动.
css选择器的优先级是什么？
内联样式<h1 :style="{color:'red','font-size':'50px'}">这是一个善良的h1</h1> 在标签里面的
内联样式>id选择器>类选择器=属性选择器=伪类选择器>元素选择器=伪元素选择器>通配符选择器

未完待续