【问题标题】:Html/Css border around list列表周围的 Html/Css 边框
【发布时间】:2017-04-02 05:34:41
【问题描述】:

嘿,我想知道如何在无序列表周围和列表周围制作边框。有点像一个盒子。我试过在网上搜索它,但我就是想不通。

【问题讨论】:

  • ul { border: 2px solid black; } 会为你做这件事。你需要更多的补充吗? ;)
  • 请发布代码示例。

标签: html css border


【解决方案1】:

ul{
        display:inline-block;
        border:1px solid #000;
        padding:20px;
}
<ul>
  <li>hey</li>
  <li>hey</li>
  <li>hey</li>
</ul>

这应该可以解决问题! :)

编辑

我已经编辑了我的答案...现在它就在列表项周围...不是 100%

【讨论】:

  • 我怎样才能让它适合列表,所以它只是绕过它而不是整个页面?
  • 这对我很有帮助,谢谢,但现在它只是左侧的一些空白
【解决方案2】:

有两种方法可以解决这个问题。您可以像另一个示例中所示放置一个 ul 选择器,或者只是将它放在一个 , 有点像一个容器。然后只需用高度和宽度编辑它。但我会坚持你所要求的。下面是一些代码。

ul {
  border: 1px solid black;
  padding-right: 0px;
  padding-left: 28px;
  width: 50px;
  border-radius: 5px;
}
<ul>
  <li>Hello</li>
  <li>Hello</li>
  <li>Hello</li>
</ul>

如果您对此有任何其他问题,请告诉我!

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-05-29
    • 2015-01-10
    • 1970-01-01
    • 2012-11-01
    • 1970-01-01
    • 2018-08-17
    • 2012-11-05
    相关资源
    最近更新 更多