通过CSS的child，做一组可以自由组合的组件，现在有一个问题，如何让两个元素的边重叠？（注意不是去除）

html-css021

通过CSS的child，做一组可以自由组合的组件，现在有一个问题，如何让两个元素的边重叠？（注意不是去除）,第1张

使用定位一点点来调整，或者使用margin-left的负值来调整，另外，告诉你一点，类名不要那么长，看起来太啰嗦了，会给自己和别人造成很大的阅读困难。

比如class="input1",这样就行了，太长了会有很多问题

做前端一定要记住:nth-child(2)这个选择器，它可以帮你轻松选择你想要的标签并给与修改添加样式

下面通过几个例子说明，相信你一看就明白

:nth-child(2)表示选取第几个标签，”2可以是你想要的数字”

:nth-child(n+4)选取大于等于4标签，”n”表示从整数

:nth-child(-n+4)选取小于等于4标签

:nth-child(2n)选取偶数标签，2n也可以是even

:nth-child(2n-1)选取奇数标签，2n-1可以是odd

:nth-child(3n+1)自定义选取标签，3n+1表示”隔二取一”

:last-child选取最后一个标签

:nth-last-child(3)选取倒数第几个标签,3表示选取第3个

.spanWenBenKuangZuHeRongQi>input+span,.spanWenBenKuangZuHeRongQi>span+input{margin-left:-1px}

改为：

.spanWenBenKuangZuHeRongQi>input+span{position: relativeleft:-1px}

.spanWenBenKuangZuHeRongQi>span+input{margin-left:-2px}