首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > CSS >

HTML中无序或者有序列表怎么横着排呢

2012-04-07 
HTML中无序或者有序列表如何横着排呢像这几行代码:h2 alignright ulli第一项/lili第二项/li

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>能不能横着排啊?如果能应该怎么样实现?请高手指点?谢了!

[解决办法]

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> 

热点排行