错误的对齐 预期的对齐 你可以从图片中清楚地看到,每当我有一些不规则高度的图片时,我就会有这样的对齐问题。我尝试从css改变但没有任何建议吗? 图像被包含在div中,只有属性设置为宽度:100%我尝试改变高度,但对我来说没有用。如果图像大小大于800x600像素,则可以正常工作
代码(仅粘贴图像div和css,因为我知道图像属性中存在问题)
.product .product-image img {
width: 100%;
}
bootstrap.min.css:
img {
vertical-align: middle;
}
bootstrap.min.css:
img {
border: 0;
}
答案 0 :(得分:0)
经过5000多行CSS 我能够得到这样的东西。
<强> WORKING EXAMPLE 强>
将这些添加到您的文件中:
<强>的main.css 强>
.product {
min-height: 350px;
position: relative;
}
.product .product-info .product-price .price {
font-weight: 700;
font-size: 14px;
line-height: 30px;
margin-right: 8px;
position: absolute;
bottom: 10px;
}
.product .product-info .product-price .price-before-discount {
text-decoration: line-through;
color: #d3d3d3;
font-weight: 400;
line-height: 30px;
font-size: 14px;
position: absolute;
bottom: 10px;
right: 60px;
}
.rateit {
position: absolute;
bottom: 40px;
}
.name {
position: absolute;
bottom: 60px;
}
<强> rateit.css 强>
.rateit{
position:absolute;
}
注意:我刚刚为大尺寸设备添加了,请相应地使用媒体查询