【校招VIP】CSS校招考点之水平/垂直居中

考点介绍：
前端布局非常重要的一环就是页面框架的搭建，也是最基础的一环。在页面框架搭建之中，又有居中布局/多列布局/全局布局。今天介绍一下居中布局的水平居中和垂直居中。

『CSS校招考点之水平/垂直居中』相关题目及解析内容可点击文章末尾链接查看！

一、考点题目

1、请使用绝对定位实现水平垂直居中。
解答：在平时，我们经常会碰到让一个div框针对某个模块上下左右都居中（水平垂直居中），其实针对这种情况，我们有多种方法实现……

2、CSS 样式，通过设置左和右 ____ ，可以把块元素调整到水平居中位置。
A.边距为 auto
B.边距为 50%
C.边距为 none
D.边距为 center

解答：正确答案是 A，margin是外边距的意思，当一个元素样式属性里有margin:0 auto时......

3、有关 CSS 外边距 margin 说法错误的是（）
A.围绕在元素边框的空白区域是外边距
B.margin 设置为 auto 相当于设置为 0
C.设置外边距会在元素外创建额外的「空白」
D.设置外边距使用 margin 属性，可以接受任何长度单位、百分数值甚至负值

解答：正确答案是 B，margin 设置为 auto 时，浏览器会自动计算外边距……

4、请你说说设置水平居中，垂直居中，设置斑马线表格(纯css)
解答：水平居中，行内元素：父元素 text-align: center……

5、文字居中的CSS代码是？
解答：text-align:center;……

二、考点文章

1、CSS水平居中+垂直居中的方法总结
首先看它的父元素是不是块级元素，如果是，则直接给父元素设置 text-align: center;……

2、HTML+CSS，让div在屏幕中居中（水平居中+垂直居中）方法总结
最近写网页经常需要将div在屏幕中居中显示，遂记录下几个常用的方法，都比较简单……

3、CSS 设置元素水平垂直居中的几种方式
如何让一个行内元素（文字、图片等）水平垂直居中……

三、考点视频

把CSS的复杂选择器和简单选择器放到一起比较优先级，会不会晕

当我们写页面的时候，不知道你会不会产生这样的问题，为什么我给他添加的这条样式分明已经选择到我要给的元素了，但是他的样式并没有生效，那是为什么呢……

『CSS校招考点之水平/垂直居中』相关题目及解析内容可点击下方链接查看：

CSS校招考点之水平/垂直居中-移动端链接
CSS校招考点之水平/垂直居中-PC端链接