HTML中无序或者有序列表怎么横着排呢
日期：2014-05-17 浏览次数：21058 次
HTML中无序或者有序列表如何横着排呢
像这几行代码：
<h2 align="right" ><ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</h2>
<h2><center><ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</center></h2>
第一个<ul>和第二个<ul>是竖着排的，我想请问一下，这两个<ul>能不能横着排啊？如果能应该怎么样实现？请高手指点？谢了！
------解决方案--------------------
像这几行代码：
<h2 align="right" ><ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</h2>
<h2><center><ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</center></h2>
第一个<ul>和第二个<ul>是竖着排的，我想请问一下，这两个<ul>能不能横着排啊？如果能应该怎么样实现？请高手指点？谢了！
------解决方案--------------------
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>111</title>
<style type="text/css">
ul{
float:left;
}
</style>
<script type="text/javascript">
<!--
-->
</script>
</head>
<body>
<h2 align="right" ><ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</h2>
<h2><ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</h2>
</body>
</html>
------解决方案--------------------
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<style type="text/css">
.divlist{ float:left;width:600px;}
.divlist ul{ list-style-type:none;width:600px;}
.divlist li{ width:150px; float:left; }
</style>
<div class="divlist">
<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
<ul>
<li>第一项</li>
<li>第二项</li>
<li>第三项</li>
<li>第四项</li>
</ul>
</div>
</body>
</html>
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
