Question

我试图获得彼此相邻的3列输出。我得到的是一列彼此叠加。我的代码中缺少什么？

[]之间的输入是可变的，来自另一页。这很好用。

它一直在说我必须添加更多信息，但我不知道应该添加什么以使其更清晰。

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <title>MAINTITLE:: [TITEL] </title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
            <style type="text/css" title="currentStyle">
                @import "assets/bootstrap/css/bootstrap-responsive.min.css";
                @import "assets/bootstrap/css/bootstrap.min.css";
                @import "assets/css/main.css";
            </style>
            <script type="text/javascript" language="javascript" src="assets/jquery/jquery.js"></script>
            <script type="text/javascript" language="javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
            <script type="text/javascript" language="javascript" src="assets/js/page.default.js"></script>
            </script>
    </head>
    <body>
            <div class="top-bar">
                <div class="logo"></div>
            </div>
            <div class="title-bar">
            </div>
        <div class="container">
        <div class="row clearfix">
                <div class="col-md-12 column">
                    <div class="row" style="margin-top: 180px !important"></div>
                    </div>
                </div>
        </div>
         <div class="container">
               <div class="row clearfix">
                <div class="col-md-12 column">
                    <div class="row">
                        <div class="col-md-4">
                            <div class="thumbnail">
                                <img alt="300x200" src="[PICTURE]" width="300" />
                                <div class="caption">
                                    <h3>
                                        [NAME]
                                    </h3>
                                    <p>
                                        [TEXT]
                                    </p>
                                    <p>
                                        <a class="btn btn-primary" href="index.php?action=DETAILPAGE&id=[_ID]">Go!</a>
                                    </p>
                                </div>
                            </div>
                        </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
         </div>
    </body>
</html>

Answer 1

围绕所有列创建一个类行div。您有三行，这就是为什么每列都在一个单独的行上。

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>MAINTITLE:: [TITEL] </title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <style type="text/css" title="currentStyle">
            @import "assets/bootstrap/css/bootstrap-responsive.min.css";
            @import "assets/bootstrap/css/bootstrap.min.css";
            @import "assets/css/main.css";
        </style>
        <script type="text/javascript" language="javascript" src="assets/jquery/jquery.js"></script>
        <script type="text/javascript" language="javascript" src="assets/bootstrap/js/bootstrap.min.js"></script>
        <script type="text/javascript" language="javascript" src="assets/js/page.default.js"></script>
        </script>
</head>
<body>
        <div class="top-bar">
            <div class="logo"></div>
        </div>
        <div class="title-bar">
        </div>
    <div class="container">
    <div class="row">
                    <div class="col-md-1">
                        <div class="thumbnail">
                            <img alt="300x200" src="[PICTURE]" width="300" />
                            </div>
                            </div>

                            <div class="caption">
                                <div class="col-md-1">
                                <h3>
                                    [NAME]
                                </h3>
                                </div>
                                <div class="col-md-1">
                                <p>
                                    [TEXT]
                                </p>
                                </div>
                                <div class="col-md-1">
                                <p>
                                    <a class="btn btn-primary" href="index.php?action=DETAILPAGE&id=[_ID]">Go!</a>
                                </p>
                                </div>
                            </div>


            </div>
            </div>
</body>

而是列出了彼此相邻的HTML列

1 个答案: