首先是HTML以及CSS篇，主要问题集中在CSS上
一、.说一下你常用的集中布局方式
答：这个你需要集中的往盒模型、flex布局说，还有一个grid布局，我浏览过，但是没有实际的用到过
二、.实现水平居中的几种方法？
答：1.对于行内元素：text-align:center;
2.对于确定宽度的块级元素：margin和width实现水平居中；固定宽度块级元素水平居中，通过使用绝对定位，以及设置元素margin-left为其宽度的一半。
3.对于未知宽度的块级元素：
（1）table标签配合margin左右auto实现水平居中，使用table标签（或直接将块级元素设值为display:table），再通过给该标签添加左右margin为auto；
（2）inline-block实现水平居中方法（存在问题：需额外处理inline-block的浏览器兼容性（解决inline-block元素的空白间距））；
（3）绝对定位实现水平居中，绝对定位+transform，translateX可以移动本省元素的50%
（4）相对定位实现水平居中，用float或者display把父元素变成行内块状元素
（5）CSS3的flex实现水平居中方法，法一
.contentParent{
display: flex;
flex-direction: column;
}
.content{
align-self:center;
}
（6）CSS3的flex实现水平居中方法，法二
.contentParent{
display: flex;
}
.content{
margin: auto;
}
（7）CSS3的fit-content配合左右margin为auto实现水平居中方法
.content{
width: fit-content;
margin-left: auto;
margin-right: auto;
}
三、如何实现左右两栏一定比例，左栏高度随右栏高度自适应
答：
margin负值实现分栏高度显示一致可以说是最好的方法，还有其他一些轻便的替代方法。例如使用
min-height属性，IE6不支持
min-height但是
height会自动撑高，所以
min-height +
_height的组合也是常用手段之一；另外就是使用背景图片了，利用背景图片的垂直平铺，可以模拟分栏的等高背景效果，但是，此方法对布局宽度有一定的要求，如果布局宽度改变，背景图片可能也要做一番修改。