21.如何实现水平、垂直居中?
在别的文章10种方式中,挑选了几个觉得比较常用的,也有其他的可以在链接里面查看!
/* 第一种方案 display:flex
子元素高度可以设定也可以不设定
*/
.app{
width: 500px;
height: 500px;
background: greenyellow;
display: flex;
align-items: center;
justify-content: center;
}
.app>div{
width: 100px;
height: 100px;
font-size: 20px;
background: blueviolet;
}
/* 第二种方案 position+margin
子元素高度可以设定也可以不设定
*/
.app{
width: 500px;
height: 500px;
background: greenyellow;
position: relative;
}
.app>div{
width: 100px;
height: 100px;
font-size: 20px;
background: blueviolet;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom:0;
margin: auto;
}
/* 第三种方案 position+transform
子元素高度可以设定也可以不设定
*/
.app{
width: 500px;
height: 500px;
background: greenyellow;
position: relative;
}
.app>div{
width: 100px;
height: 100px;
font-size: 20px;
background: blueviolet;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%,-50%);
}
/* 第四种方案
高度就是文字加line-height的高度
局限性在于必须里边的元素是inline否则不生效*/
.app{
width: 500px;
height: 500px;
background: greenyellow;
line-height: 500px;
text-align: center;
}
.app>div{
width: 100px;
font-size: 20px;
background: blueviolet;
display: inline;
}
/* 第五种方案 横向利用margin auto,垂直还是利用定位和平移 也不用管里边元素的高度*/
.app{
width: 500px;
height: 500px;
background: greenyellow;
}
.app>div{
width: 100px;
font-size: 20px;
background: blueviolet;
position: relative;
top: 50%;
transform: translateY(-50%);
margin-left: auto;
margin-right:auto ;
}
/* 第八种方案 单行文本好居中 就是让文本的父元素的line-height和高度相同*/
.app{
width: 500px;
height: 500px;
background: greenyellow;
text-align: center;
line-height: 500px;
}
.app>div{
width: 100px;
height: 100px;
font-size: 20px;
background: blueviolet;
display: inline;
}
具体参考:最全CSS3实现水平垂直居中的10种方案
22.实现左侧边栏固定,其他内容自适应?
(1)固定宽度区浮动float,自适应区宽度自适应设置margin;
(2)固定宽度区使用绝对定位,自适应区仍然设置margin;
(3)flex布局
具体参考:实现侧栏固定宽度,内容栏宽度自适应
23.做node用了什么框架
- Node.js Express
对于一个已经在使用 node.js 的开发人员来说,Express 或者"node.js express"并不是一个新鲜事。Express 框架提供了对 node.js 原生 API 的比较好的封装,从而使开发者更加容易地使用node.js。
Express 框架提供了用来开发强壮的 web/移动应用,以及 API 的所有功能。并且开发人员还能够方便地为它开发插件和扩展,从而增加 Express 的能力。下面列出了一些 Express 提供的基本的功能:
-
可以和任何的第三方数据库进行通讯
-
可以使用任何的用户认证方式
-
可以使用任何符合 Express 接口定义的模板引擎
-
可以按照需要定义工程目录
通过使用 Node Express,你可以使用更少的代码来实现功能。至少通过使用 Node Express,你可以实现中间件来响应 http 请求,可以定义路由表来定义对不同请求的响应函数,还可以使用模板引擎来输出 html 页面。
对于一个 NodeJS 开发新手来说,Express 还提供了如下的好处:1)Express的学习曲线并不陡峭,可以很快上手;2)Express 有非常庞大的社区,和组织良好的文档,新手可以很容易得到所需要的一切。
Express 根据 MIT 协议进行开源,目前 StrongLoop 对它提供支持。
你可以通过 Express 的官方网站 expressjs.com 获得更多的信息。
24.浏览器存储
主要有cookie、localStorage、sessionStorage
详细请看:浏览器存储
25.浏览器图片加载
26.同源策略,跨域,后台如何解决跨域,html有哪些标签可以跨域
详情请看:同源策略,跨域,后台如何解决跨域,html有哪些标签可以跨域
27.http状态码
HTTP状态码的作用是告知客户端,从服务器端返回的请求结果。
详情请看:HTTP状态码
28.用mongodb做过什么
1.什么是MongoDB ?
MongoDB 是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统。
在高负载的情况下,添加更多的节点,可以保证服务器性能。
MongoDB 旨在为WEB应用提供可扩展的高性能数据存储解决方案。
MongoDB 将数据存储为一个文档,数据结构由键值(key=>value)对组成。MongoDB 文档类似于 JSON 对象。字段值可以包含其他文档,数组及文档数组。
2.用MongoDB做过什么项目(什么都没有请看3,现在开始学习也不晚嘛)
3.MongoDB教程
29.node.js
1.什么是node.js?
简单的说 Node.js 就是运行在服务端的 JavaScript。
Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。
Node.js是一个事件驱动I/O服务端JavaScript环境,基于Google的V8引擎,V8引擎执行Javascript的速度非常快,性能非常好。
2.安装和使用node.js
30.vue项目
31.本地存储
32.微信小程序获取用户信息
1.微信小程序———获取用户信息 以及如何展示到wxml
2.微信小程序——获取用户信息
33.v-model双向绑定原理
1.面试总结:vue实现数据双向绑定的原理
2.浅谈vue双向绑定原理