0

我发现此网页存在一些 HTML\CSS 困难：http: //www.saranistri.com/saranistriWPnew/?page_id=613

正如您在此页面中看到的那样，有一个名为：abusivismo1-641x321.jpg的图像

此图像位于此 div 容器结构中：

具有 clasas vc_span12 wpb_column column_container的div 包含具有类 wpb_wrapper 的另一个 div，该类wpb_wrapper包含自身wpb_single_image wpb_content_element centerizedImg包含具有类wpb_wrapper的 div最终包含我的abusivismo1-641x321.jpg

我想以页面中心的方式将此图像置于其容器中

我尝试设置一些 CSS 设置，例如：

width: 642px;
margin: 0 auto;

但不工作

你能帮助我吗？

Tnx 这么多

安德烈亚

4

6 回答 6

2

只需将此样式添加到该类：

.wpb_single_image.wpb_content_element.centerizedImg {

text-align:center

}

如果您想确保仅使图像居中，请使用 display:inline-block 设置图像包装器的样式；

只是一个没有边距的简单解决方案。

于 2013-10-11T12:06:30.803 回答
2

这是解决方案。

.wpb_content_element.wpb_single_image img {
    display: table;
    height: auto;
    margin: 0 auto;
    max-width: 100%;
}

替换您班级中的上述值，您.wpb_content_element.wpb_single_image img的图像将位于中心。

希望这可以帮助。

于 2013-10-11T11:40:58.870 回答
0

只text-align:center;为你的wpb_wrapper课使用。看看这个小提琴

于 2013-10-11T12:22:54.550 回答
0

在某些情况下，根据您的使用情况，当您调整浏览器大小时，图像不会自动调整大小；即移动浏览器。我想出了这个：

.wpb_wrapper {
    display:inline-block;
    max-width: 100%;
    height: auto;
    width: auto\9; /* ie8 */
    padding: 0px 15px 0px 15px; /* adds some white space in left/right on mobile */
}

希望它可以帮助某人。

于 2014-06-13T00:01:43.763 回答
0

为了集中任何元素，您可以使用

margin-left: auto;
margin-right: auto;

此外，如果一个元素的专利具有text-align: center

你也可以看看死亡中心

于 2013-10-11T11:48:39.490 回答
0

使用它margin-left:auto;，margin-right:auto;它将水平对齐到中心。

于 2013-10-11T12:37:15.430 回答