Html 如何在列表中调用am（image）div？_Html_Css

Html 如何在列表中调用am（image）div？

html css

Html 如何在列表中调用am（image）div？,html,css,Html,Css,我正在尝试为我正在制作的web模板构建标题/导航系统，下面是我尝试做的概述：这是我的CSS代码 #header { margin:0 auto; width:1000px; height:auto; background-color:#666; } #header .navimg { width: 300px; height: 300px; border-radius: 150px; -webkit-border-radius:

我正在尝试为我正在制作的web模板构建标题/导航系统，下面是我尝试做的概述：

这是我的CSS代码

#header {
    margin:0 auto;
    width:1000px;
    height:auto;
    background-color:#666;
}

#header .navimg {
    width: 300px;
    height: 300px;
    border-radius: 150px;
    -webkit-border-radius: 150px;
    -moz-border-radius: 150px;
    background: url(../images/header_img.png) no-repeat;
    box-shadow: 0 0 8px rgba(0, 0, 0, .8);
    -webkit-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
    -moz-box-shadow: 0 0 8px rgba(0, 0, 0, .8);
}

#header ul {
    list-style-type: none;
}

#header ul li {
    display: inline;
}

这是我正在使用的HTML

<body>
    <div id="header">
        <ul>
            <li><a href="">Durka Durk</a></li>
            <li><a href="">Durka Durk</a</li>
            <li><div class="navimg"></div></li>
            <li><a href="">Durka Durk</a></li>
            <li><a href="">Durka Durk</a></li>
        </ul>
    </div>
</body>

这是我运行它时得到的结果：（因为我刚刚启动它，所以看起来很起伏）

我希望中间的图像显示在与链接相同的行中，而不是在新的行上。如何实现这一点？

在一行中显示内容，这可以通过对这两个元素使用

display:inline

来实现。在您的情况下，

ul

和

img

您还可以尝试更改图像的宽度和高度

在一行中显示内容，这可以通过对这两个元素使用

display:inline

来实现。在您的情况下，

ul

和

img

您还可以尝试更改图像的宽度和高度

如果更改

显示：inline到<代码>浮动：左侧然后您将达到所需的效果
您需要将图像高度添加到标题div
，以显示颜色
我有把小提琴让你看看它会是什么样子
#header ul li {
  float: left;
}

#header {
  margin:0 auto;
  width:1000px;
  height: 300px;
  background-color:#666;
}

如果更改显示：inline到<代码>浮动：左侧然后您将达到所需的效果
您需要将图像高度添加到标题div
，以显示颜色
我有把小提琴让你看看它会是什么样子
#header ul li {
  float: left;
}

#header {
  margin:0 auto;
  width:1000px;
  height: 300px;
  background-color:#666;
}


试试这个。您必须“浮动左li”，而不是使用“显示内联”。并在锚定标签上添加衬垫进行调整
差不多吧
试试这个。您必须“浮动左li”，而不是使用“显示内联”。并在锚定标签上添加衬垫进行调整
差不多吧
没问题，伙计！我很高兴我能为你的设计提供帮助，祝你好运。没问题，伙计！我很高兴我能为您的设计提供帮助，祝您好运。我如何使li
s浮动到左侧，但仍保持所有内容居中？@BrandonJackson您必须给出“UL”边距：0 auto；它将使它成为中心。但是“UL”的父（）应该是浮动的。为了使您的设计在所有浏览器中都不会出现问题，我可以将li
s浮动到左侧，但仍保持所有内容居中吗？@BrandonJackson您必须给出“UL”边距：0 auto；它将使它成为中心。但是“UL”的父（）应该是浮动的。这样，您的设计在所有浏览器中都不会出现问题