Html 无法将图像居中放置在div内

我的页面上有一个顶部div，但在导航上方。 我想在这个div中间有公司标志。但是，<代码>空白：0自动< /代码>不起作用。 我试过摆弄div的位置，使其成为绝对的，使图像成为相关的，反之亦然

我试过将图像居中对齐，文本对齐（够傻了），甚至

左：50%

<代码>左：50%确实有效，但由于图像的宽度超过100px，因此徽标不再居中，即使图像的起始位置为50%

我想让它只剩下30%，但这对所有屏幕尺寸都不公平。 我就是想不出怎么把这个图像放在div的中心。有人知道我怎么做吗

HTML

CSS

---

如果将元素定位为

绝对

，则

边距0自动

将不起作用 移除

位置：绝对

并将

display:block

添加到

jcbogo

css类

.JClogo{
   margin: 0 auto;
   height: 194px;
   width: 389px;
   display:block;
}

---

如果将元素定位为

绝对

，则

边距0自动

将不起作用 移除

位置：绝对

并将

display:block

添加到

jcbogo

css类

.JClogo{
   margin: 0 auto;
   height: 194px;
   width: 389px;
   display:block;
}

---

如果将元素定位为

绝对

，则

边距0自动

将不起作用 移除

位置：绝对

并将

display:block

添加到

jcbogo

css类

.JClogo{
   margin: 0 auto;
   height: 194px;
   width: 389px;
   display:block;
}

---

如果将元素定位为

绝对

，则

边距0自动

将不起作用 移除

位置：绝对

并将

display:block

添加到

jcbogo

css类

.JClogo{
   margin: 0 auto;
   height: 194px;
   width: 389px;
   display:block;
}

---

我认为margin:0 auto不能与绝对定位一起工作。移除

位置：绝对
或放置
左侧：50%；左边距：-195px
在
.jcdogo
我不认为边距：0自动将与绝对定位一起工作。移除
位置：绝对
或放置
左侧：50%；左边距：-195px
在
.jcdogo
我不认为边距：0自动将与绝对定位一起工作。移除
位置：绝对
或放置
左侧：50%；左边距：-195px
在
.jcdogo
我不认为边距：0自动将与绝对定位一起工作。移除
位置：绝对
或放置
左侧：50%；左边距：-195px
在
.jcdogo
这应该满足您的要求：

        #stripes
        {
            width: 100%;
            height: 185px;
            background-image: url('stripes.png'); 
            text-align:center;
        }

        .JClogo
        {
            height: 194px;
            width: 389px;
        }

这应该满足您的需求：

        #stripes
        {
            width: 100%;
            height: 185px;
            background-image: url('stripes.png'); 
            text-align:center;
        }

        .JClogo
        {
            height: 194px;
            width: 389px;
        }

这应该满足您的需求：

        #stripes
        {
            width: 100%;
            height: 185px;
            background-image: url('stripes.png'); 
            text-align:center;
        }

        .JClogo
        {
            height: 194px;
            width: 389px;
        }

这应该满足您的需求：

        #stripes
        {
            width: 100%;
            height: 185px;
            background-image: url('stripes.png'); 
            text-align:center;
        }

        .JClogo
        {
            height: 194px;
            width: 389px;
        }

问题的原因在于以下代码：

position: absolute; // here
margin: 0 auto;
height: 194px;
width: 389px;

绝对位置使其在提供的参数处浮动

所以试试这个，这将使图像浮动在元素的中心

position: absolute;
top: 20%; // this 
left: 20%; // and this
height: 194px;
width: 389px;

这样，您将更改图像的参数并使其浮动到您希望的位置。如果要使用
位置：绝对
否则，您可以删除此项，只需使用
margin:values
问题是由于以下位置的代码造成的：

position: absolute; // here
margin: 0 auto;
height: 194px;
width: 389px;

绝对位置使其在提供的参数处浮动

所以试试这个，这将使图像浮动在元素的中心

position: absolute;
top: 20%; // this 
left: 20%; // and this
height: 194px;
width: 389px;

这样，您将更改图像的参数并使其浮动到您希望的位置。如果要使用
位置：绝对
否则，您可以删除此项，只需使用
margin:values
问题是由于以下位置的代码造成的：

position: absolute; // here
margin: 0 auto;
height: 194px;
width: 389px;

绝对位置使其在提供的参数处浮动

所以试试这个，这将使图像浮动在元素的中心

position: absolute;
top: 20%; // this 
left: 20%; // and this
height: 194px;
width: 389px;

这样，您将更改图像的参数并使其浮动到您希望的位置。如果要使用
位置：绝对
否则，您可以删除此项，只需使用
margin:values
问题是由于以下位置的代码造成的：

position: absolute; // here
margin: 0 auto;
height: 194px;
width: 389px;

绝对位置使其在提供的参数处浮动

所以试试这个，这将使图像浮动在元素的中心

position: absolute;
top: 20%; // this 
left: 20%; // and this
height: 194px;
width: 389px;

这样，您将更改图像的参数并使其浮动到您希望的位置。如果要使用
位置：绝对
否则，您可以删除此项，只需使用
margin:values
删除
position:absolute
，添加
显示：block
。删除
位置：absolute
，添加
显示：block
。删除
位置：absolute
，添加
display:block
。工作：-删除
margin
，它没有任何用处。工作：-删除
margin
，它没有任何用处。工作：-删除
margin
，它没有任何用处。好了，好了。好了，好了，好了，好了，好了，好了，负边距是图像宽度的一半。如果你想绝对定位图片，我会这样做。负边距是图片宽度的一半。如果你想绝对定位图片，我会这样做。负边距是图片宽度的一半。如果你想绝对定位图片，我会这样做。负边距是图片宽度的一半。如果你想绝对定位图像，我会这样做。