css - 对齐div中的项目？

Question

我试图远离表格，因为我被告知它们只能用于表格数据。但是，我对如何实现此功能感到困惑。我的导航栏有一个搜索按钮、注册链接、登录链接和两个分隔符。如何将 div 中的每个项目对齐，就像一个可以与表格一样？请原谅我对 CSS 的新手 =P

Answer 1

<ul class="menu">
 <li>Link 1</li>
 <li>Link 2</li>
 <li>Link 3</li>
 <li>Link 4</li>
</ul>

<style type="text/css">
   .menu {margin:0px;padding:0px;list-style:none;width:600px;margin:auto}
   .menu li {display:inline;padding:5px;margin-right:10px;background-color:#333;color:#fff}
</style>

虽然我没有测试过，但这应该会给你你正在寻找的东西。对上面的代码进行试验，以根据您的要求进行微调。是的，不需要一直避免使用桌子。对于显示表格数据，表格是最佳选择

Answer 2

如果你是新手，试试这个工具。 http://accessify.com/tools-and-wizards/developer-tools/list-o-matic/