【Web前端】 基础知识1

平时学习中有些知识点学到了，但是过会就忘记了，做一个笔记来记录，方便后期开发查阅。

1. 水平居中和垂直居中

水平居中：文字的左右两边的间距是一样的，

垂直居中:文字的上边和下边的间距是一样的。 参考

2.两面翻转的盒子问题

当指定元素背面朝向观察者时，是否可见。

// 初始背面的盒子隐藏,观察者不可见
backface-visibility: hidden;

参考

3.外边距坍塌【外边距合并】问题

外表句坍塌的形成：两个块级元素block的相邻外边距会合成为一个外边距，以绝对值相对较大的外边距值为准。这种现象称为外边距塌陷或外边距合并。这种情况只会在垂直方向上的外边距上发生。所以行内元素inline和行内块级元素inline-block不会发生边距塌陷，因为它们不能设置垂直边距。

脱离标准流不会触发外边距坍塌，浮动元素、绝对定位、固定定位都不会触发外边距坍塌【外边距合并】的问题

参考文章

4.清除浮动

父盒子本身有高度，不需要清除浮动.清除浮动之后，父级会根据浮动的盒子自动检测高度，父级有了高度，就不会影响下面的标准流了。如果父盒子本身没有设置高度，通过浮动来实现自适应高度，但是下方的其他区域的盒子要按要求排列，就需要父盒子清除浮动了。

参考

5.input是否一定要被form包裹

1.所有向后台提交数据（包括原生和ajax提交）的input都建议用form包裹，

2.如果只是用来做前台交互效果则不推荐使用form包裹。 但提交数据时，其实也可以不用form包裹input标签：

1.如果有form标签，在点击提交铵钮时，浏览器自动收集参数，并打包一个http请求到服务器，完成表单提交。

2.如果没有form，post方式的提交要使用ajax手工完成。get方式的提交需要自己拼接url。 参考