Html 在一行中显示文本和图像（内联）_Html

Html 在一行中显示文本和图像（内联）

html

Html 在一行中显示文本和图像（内联）,html,Html,我有一个标识栏，我想在我的网站顶部。我希望这是一个简单的文本，旁边有一个图像我使用以下代码，但图像显示在文本下面。我正在使用一个div，它在一个列表中同时包含文本和图像，我已经将其设置为inline，但它们不显示在一行中 <doctype! html> <html> <head> <title> Breaditt </title> <style> html, body { font-family: s

我有一个标识栏，我想在我的网站顶部。我希望这是一个简单的文本，旁边有一个图像

我使用以下代码，但图像显示在文本下面。我正在使用一个div，它在一个列表中同时包含文本和图像，我已经将其设置为inline，但它们不显示在一行中

<doctype! html>
<html>

<head>
    <title> Breaditt </title>
    <style>
html, body {
font-family: sans-serif;
margin: 0;
padding: 0; }


#logobar {
background: rgb(206, 211, 255);
display: inline-block; }

#logobar ul {
list-style-type: none;
margin: 0; }

#logobar li {
display: inline; }


#logobar p {
font-size: 18;
font-family: Comic sans MS; }






    </style>
</head>


<body>

    <div id="logobar">
        <ul>
        <li><p> Breaditt </p></li>
        <li><img src="img/logo.jpg" alt="breaditt cat" width="100"     height="100"></li>
        </ul>
    </div>




</body>

</html>


面包师傅
html，正文{
字体系列：无衬线；
保证金：0；
填充：0；}
#标识栏{
背景：rgb（206、211、255）；
显示：内联块；}
#标识栏ul{
列表样式类型：无；
边距：0；}
#标识栏li{
显示：内联；}
#标识栏p{
字号:18 ;；
字体系列：Comic sans MS；}

面包师傅

您应该删除文本周围的段落。段落是块元素，它将打断行：

<div id="logobar">
    <ul>
        <li>Breaditt</li>
        <li><img src="img/logo.jpg" alt="breaditt cat" width="100"     height="100"></li>
    </ul>
</div>

更改：

#logobar li {
    display: inline;
}

到

无需使用列表。尝试：

<div id="logobar">
   <p> Breaditt </p>
   <img src="img/logo.jpg" alt="breaditt cat" width="100"     height="100">
</div>

只是想让您知道，这不是您声明doctype的方式<代码>对您来说是正确的方法。谢谢！我删除了sOk，很乐意帮忙。请记住接受/支持解决问题的答案

#logobar li {
    float: left;
}

<div id="logobar">
   <p> Breaditt </p>
   <img src="img/logo.jpg" alt="breaditt cat" width="100"     height="100">
</div>

#logobar>* {
display: inline; }