通过CSS将这些元素内联/放在一行中

Question

我的Joomla CMS中的模块生成以下代码：

<li id="myid" clas="">
   <span>
      <strong>1.</strong>
   </span>

   <dl>
      <dt>
         <span>Some text</span>
      </dt>
  </dl>
</li>

这不能在html中编辑，因为它是通过多个插件创建的。 有没有办法让“一些文字”出现在“1”的右侧。通过CSS。我试过像：

li {
    display: inline;
}

哪个不起作用。你有什么建议吗？非常感谢你！

Answer 1

您需要将dl和dt设置为inline，因为它们的默认值为block：

#myid dl, #myid dt {
    display: inline;
}

Answer 2

为什么不使用有序列表而不是无序列表？它可以简化..

但是如果您想要使用您的代码，则必须从列表编号中删除“”标记，因为它将被弃用。解决方法是在您的代码中为您的数字添加class ='strong'并添加更多css，这里是'strong'类的代码：

#myid .strong{
    font-weight:bold;
}

您的HTML代码：

<li id="myid" clas="">
   <span class="strong">1.</span><dl>
      <dt>
         <span>Some text</span>
      </dt>
  </dl>
</li>