为什么用css样式做出来的商品列表下边总是对不齐,css样式中哪里出错了,高人帮忙看看

html-css010

为什么用css样式做出来的商品列表下边总是对不齐,css样式中哪里出错了,高人帮忙看看,第1张

你要放也把全部的代码放出来啊,下面的html没有也不好判断

css这个东西需要熟练掌握才能知道哪里出问题,看到你写了这么多padding,margin,问题应该就出在这里了,padding,margin这些会叠加,或者不叠加,这个出来效果是不一样的

真不了解就建议固定高度,然后写一个overflow:hidden就解决了

其实都可以 就看喜欢 div布局

<div class="wrap">

<div>商品</div>

<div>商品</div>

<div>商品</div>

<div>商品</div>

<div>商品</div>

</div>

UL 布局

<ul class=“wrap”>

<li>商品</li>

<li>商品</li>

<li>商品</li>

</ul>

居中对齐可以写样式控制,列如:

.wrap{width:600pxmargin:auto auto}

如果列表项需要两端对齐的话,可以对列表项精确控制即可

举一个简单的ul,li的列表例子,实现如下效果:

常规写法(使用last-child选择器):

写法2(使用not选择器):

写法2(使用+选择器):

相邻兄弟选择器(Adjacent sibling selector)可选择紧接在另一元素后的元素,且二者有相同父元素。