css - 使 <ul> 标签与文本显示在同一行

标签 css

我正在尝试制作 <ul>标签显示与一行文本内联。这是 HTML。

<li>
  <input type="checkbox" id="449" value="Whats that?" class="checkbox"><label for="449">Whats that?</label>
  <ul class="449">
    <li>{...removed...}</li>
    <li>{...removed...}</li>
    <li>{...removed...}</li>
    <li>{...removed...}</li>
  </ul>
</li>

它现在呈现的是这样的:

Whats that?
  Li element
  Li element
  Li element
  Li element

但我希望它像这样呈现:

Whats that? Li element
            Li element
            Li element
            Li element

我需要将哪些 CSS 规则放入其中 <ul> ?别介意那个类名,它是为了滑稽的 javascript 目的。谢谢!

最佳答案

漂浮它们:

p, ul {
    float: left;
    margin: 0;
    padding: 0;
}
li {
    list-style-type: none;
}

<p>Whats that?</p>
<ul>
    <li>Li element</li>
    <li>Li element</li>
    <li>Li element</li>
    <li>Li element</li>
</ul>

关于css - 使 <ul> 标签与文本显示在同一行,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4832051/

相关文章:

html - 从顶部淡入淡出到一段?

containers - 收缩包装并居中放置内联 block 元素的容器

html - 居中 li 和最后一个 child 的边距

html - 如何使用 CSS 对图像进行去饱和和饱和处理?

html - 覆盖某些元素的 CSS 选择器

css - 如何使用 flex 盒均匀分布图像和子元素?

javascript - 当页眉到达顶部时 Div 开始滚动,当底部到达页脚时停止滚动

html - 垂直对齐 bootstrap div 中的内容

html - Grails: Assets 管道和 GSP 模板

html - 带背景图片的 CSS 导航