图片垂直居中的外部影响?

<!DOCTYPE html> <html> <head> <title>测试</title> <style> div img {} .wrap span {display: inline-block;border:1px solid red;text-align: center;} </style> </head> <body><div class = "wrap" style = "width:1000px;height:200px;border:1px solid red;display:table-cell;vertical-align:middle;text-align:center;min-width:800px;margin:0 auto;"> <span><img src = "images/children3.jpg"> <img src = "images/children3.jpg"> <img src = "images/children3.jpg"></span> </div> </body> </html>

以上代码效果图如下:

这里有个问题就是为什么我给外部div:margin:0 auto;他却无法在页面中居中?

还有个问题是我<爱尬聊_百科知识>给外部div加上float这个属性,整个就变成了如下截图:

以上就是我所要提的问题,希望各位路过的官人帮忙解答,谢谢


山竹有深度 14小时前

我发现table-cell去掉的话,就可以居中了, 但是就没了垂直居中,大概是margin: 0 auto;适合于block吧。所以水平居中没生效,你加float:right;他就往右去了,这样正常吧。


辉煌人生_887 14小时前

问题二


360U3013426239 14小时前

不过应该有其他方案吧~


qkoufu772 14小时前

就是用一个父元素div做水平居中,里面再套垂直居中的div,然后放图片。(这里图片我随便加的,方便看)


梅西足球王_001 14小时前

问题一


混沌精灵 14小时前

题主建议你这种问题,用runjs或者jsfiddle,然后贴出来,大家方便看。


编辑 举报 2023-06-17 14:11

0个评论

暂无评论...
验证码 换一张
相关内容