只用margin auto完成水平方向

只用`margin: auto;`来实现水平方向的居中，是CSS中常见的布局技巧，通常用于块级元素。当元素的`margin`设置为`auto`时，浏览器会自动调整该元素的外边距，使其在水平方向上居中。实现这一效果需要满足以下几个条件：

1. 元素必须是块级元素（如`<div>`、`<p>`等），因为`margin: auto;`主要作用于块级元素。
2. 需要明确指定元素的宽度，因为如果元素宽度是100%，它自然会填满整个容器，无法居中。
3. 如果元素的`position`属性不是`static`或`relative`，则可能需要额外的样式来确保居中效果。

一个常见的实现水平居中的示例CSS代码如下：

.container {
    width: 80%; /* 或者其他固定宽度 */
    margin: 0 auto; /* 水平方向自动调整外边距 */
}

/* 或者如果使用了定位布局 */

.parent {
    position: relative;
}

.child {
    position: absolute;
    width: 50%; /* 子元素的宽度 */
    left: 50%; /* 将子元素向右移动自身宽度的50% */
    margin-left: -25%; /* 通过外边距将子元素向左移动自身宽度的一半 */
}

注意，当使用绝对定位和`margin: auto;`时，可以通过调整`left`和`margin-left`的值来居中。