我怎样才能居中 <ul><li>成一个div? [英] How can I center <ul> <li> into a div?

问题描述

如何将

的无序列表居中到固定宽度的 div 中?

How can I center an unordered list of <li> into a fixed-width div?

<table width="100%">
  <tbody>
  <tr>
    <td width="41%"><img src="/web/20100104192317im_/http://www.studioteknik.com/html2/html/images/hors-service.jpg" width="400" height="424"></td>
    <td width="59%"><p align="left">&nbsp;</p>
      <h1 align="left">StudioTeknik.com</h1>
      <p><br align="left">
        <strong>Marc-André Ménard</strong></p>
      <ul>
        <li>Photographie digitale</li>
        <li>Infographie </li>
        <li>Débug et IT (MAC et PC)</li>
        <li> Retouche </li>
        <li>Site internet</li>
        <li>Graphisme</li>
      </ul>
      <p align="left"><span class="style1"><strong>Cellulaire en suisse : </strong></span><a href="#">[phone]</a></p>
      <p align="left"><strong class="style1">Skype : </strong> <a href="#">menardmam</a></p>
    <p align="left"><strong class="style1">Courriel :</strong><a href="https://web.archive.org/web/20100104192317/mailto:[e-mail]">    [e-mail]</a></p></td>
  </tr>
  </tbody>
</table>

推荐答案

由于 ul 和 li 元素默认为 display: block —给他们自动边距和小于容器的宽度.

Since ul and li elements are display: block by default — give them auto margins and a width that is smaller than their container.

ul {
    width: 70%;
    margin: auto;
}

如果您更改了它们的显示属性，或者做了一些覆盖正常对齐规则的操作(例如浮动它们)，那么这将不起作用.

If you've changed their display property, or done something that overrides normal alignment rules (such as floating them) then this won't work.

这篇关于我怎样才能居中 <ul><li>成一个div?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！