我页面上的所有内容都变成了 bootstrap 按钮，而不仅仅是按钮本身

Question

所以基本上，我页面上的所有内容都变成了一个 bootstrap 按钮，包括所有文本 - 而不仅仅是文本本身。我相信这是因为我为按钮添加了一个 href 但这是页面的屏幕截图：

如您所见，每个白色框中的所有内容都充满了错误的绿色按钮。

这是我的 php 页面代码：

<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">

<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous">

<!-- Latest compiled and minified JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

<?php
session_start();
include "init.php";
$page_title = 'Products';

$query = "SELECT productID, name, description, price
        FROM products";     

$result = mysqli_query($dbcon, $query);

print
    "<div class='navbar navbar-inverse navbar-fixed-top'>".
        "<div class = 'container'>".
          "<button type='button' class='navbar-toggle' data-toggle='collapse' data-target='.navbar-collapse'>".
            "<span class='sr-only'>Toggle navigation</span>".
            "<span class='icon-bar'></span>".
            "<span class='icon-bar'></span>".
            "<span class='icon-bar'></span>".
            "</button>".
            "</div>".
    "</div>".

    "<div class='page-header'>".
        "<div class='page-header'>".

        "</div>".
    "</div>";


if(mysqli_num_rows($result)){
    while($row = mysqli_fetch_assoc($result)){
        print

        "<div id='products' class='row list-group'>".
        "<div class='item  col-xs-4 col-lg-4'>".
            "<div class='thumbnail'>".
                "<img class='group list-group-image' alt='' />".
                "<div class='caption'>".
                    "<h4 class='group inner list-group-item-heading'>
                        'Title 1'</h4>".
                    "<p class='group inner list-group-item-text'>
                        Sample.</p>".
                    "<div class='row'>".
                        "<div class='col-xs-12 col-md-6'>".
                            "<p class='lead'>
                                654</p>".
                        "</div>".
                        "<div class='col-xs-12 col-md-6'>".
                            "<a href='baskets.php' input type='submit' value='Add to basket'  class='btn btn-success btn-block btn-lg'  >".
                        "</div>".
                    "</div>".
                "</div>".
            "</div>".
        "</div>";
    }
}
else{

}

?>

我是网络开发的新手，我不明白为什么 href 会导致这种情况。我需要 href 因为当用户单击 Add the Basket 按钮时，baskets.php 必须执行

Answer 1

您使用过：

"<a href='baskets.php' input type='submit' value='Add to basket'  class='btn btn-success btn-block btn-lg'  >"

您正在锚标记内使用 input、type，这是不应该发生的。由于 bootstrap class，你得到了绿色按钮。将上面的行替换为：

"<a href='baskets.php'>Add to basket</a>"

Answer 2

<a href='baskets.php'><button class='btn btn-success btn-block btn-lg'>Add to basket</button></a>

我页面上的所有内容都变成了 bootstrap 按钮，而不仅仅是按钮本身

Everything on my page becomes a bootstrap button rather than just the button itself

php

href

bootstrapping