这个jQuery手风琴代码有什么问题?

时间:2012-03-19 02:58:35

标签: jquery

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>jQuery UI Example Page</title>
        <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.18.custom.css" rel="stylesheet" />   
        <script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
        <script type="text/javascript" src="js/jquery-ui-1.8.18.custom.min.js"></script>
    </head>

    <script>
        $(document).ready(function(){
            $('#accordion').accordion();
        });
    </script>

    <body>

        <ul id="accordion">
      <li>
        <a href="#">Header 1</a>
        <div>Wow, look at all this content that can be shown or hidden with a simple click!</div>
      </li>
      <li>
        <a href="#">Header 2</a>
        <div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean sollicitudin. Sed interdum pulvinar justo. Nam iaculis volutpatligula. Integer  
        vitae felis quis diam laoreet ullamcorper. Etiam tincidunt est vitae est. Ut posuere, mauris at sodales rutrum, turpis tellus fermentum metus, ut      
        bibendum velit enim eu lectus. Suspendisse potenti. </div>
      </li>
      <li>
        <a href="#">Header 3</a>
        <div>Donec at dolor ac metus pharetra aliquam. Suspendisse purus. Fusce tempor ultrices libero. Sed quis nunc. Pellentesque tincidunt viverra felis.  
        Integer elit mauris, egestas ultricies, gravida vitae, feugiat a, tellus.</div>
      </li>
    </ul>

    </body>
</html>

此代码返回第一张图片,如何使其像第二张图片一样?然而,样式并不重要,我只希望标签像第二张图像一样正确对齐

第一张图片 - &gt; enter image description here

第二张图片 - &gt; enter image description here

0 个答案:

没有答案