学习CSS的定位以及其中遇到的问题

CSS中的margin：0 auto的失效

margin：0 auto的作用是设置对象上下间距为0，左右设为自动，不设置的情况下，默认元素是左对齐的，使用这个代码的好处是浏览器会自动检测父级元素的宽度，使元素的自适应父级元素的宽度并保持在中间，与其功能相近的text-align：center则可以将元素内的文字内容居中，这是两者的区别。由于代码简短，非常的方便，并且相比使用数值定位的好处是如果删除相关内容，元素的位置可能受到影响从而不再居中，所以是网上比较流行的写法，不过在实际操作的过程中也发现了一些问题。

未设置宽度导致失效

因为margin是根据父级元素的宽度自动调整的，所以如果父级元素未设置宽度，则代码本身就不会起作用（如果父级元素下的其他元素占据了空间而使父级元素有了宽度，那么应该也会生效，详细都有什么场景还没弄清楚）

浮动导致的失效

有时候会发现，绝对定位，固定定位会导致代码失效从而无法居中，实际情况是这种定位方式属于浮动定位，元素已经脱离了父级的盒子，从而不能根据父级元素进行调整，auto没了参考的值。（网上有用left：50%；margin-left：负的盒子宽度的一半从而解决的方法）

使用对象出错

有时候可能是及其简单的错误导致这条代码失效，例如margin一般是块级元素才有的属性，有的时候可能会误用在了行内元素上导致代码失效。（可以使用display：block的方法使行内元素表现出块级元素的性质从而使用这个代码达到居中的目的）

总结

出错的主要原因其实就有两个，一个是有的元素本身不具备margin的属性，另一个是margin：0 auto找不到父级元素的width。

本人接触技术较少，初次学习想多写一些日志记录所遇到的问题，有什么说的不对的希望大家指出。
2019.7.13