Question

我只需要将文本框和标签对齐到页面的中心。我无法得到这个。每次左对齐。请提出建议 Html代码：

<!DOCTYPE html>
<html>
<head>
    <title>ProjectID Creation</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
    <link href="font.css" rel="stylesheet" />

</head>
<body>
    <div class="container" style="background-color:dodgerblue">

        <h2><b>ProjectID Creation</b></h2>

        <div class="panel-group" id="accordion">
            <div class="panel panel-default">


                <div class="panel-body">




                        <div class="row">
                            <div class="col-sm-4 form-group col-md-4 col-xs-12">
                                <div class="form-group">

                                    <label id="label" class="control-label" >UserID:</label>
                                    <input type="text" class="form-control" name="user" ng-model="user" placeholder="Enter UserID" autocomplete="off" required />

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


                        <div class="row">
                            <div class="col-sm-4 form-group col-md-4 col-xs-12">
                                <div class="form-group">
                                    <label id="label" class="control-label">ProjectID:</label>
                                    <input type="text" class="form-control" name="project" ng-model="project" placeholder="Enter ProjectID" autocomplete="off" required />
                                </div>
                            </div>



                        </div>



                    <div class="temp123" style="margin-bottom:60px">

                        <button type="submit" class="btn btn-primary" ng-click="create()">Create</button>

                        <button type="clear" class="btn btn-default" ng-click="clear()">Clear</button>

                    </div>






                </div>
            </div>

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

以下是jsfiddle

中的代码

Answer 1

您可以使用text-align:center和col-lg-offset-4以及col-sm-offset-4尝试演示

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script>
<div class="container" style="background-color:dodgerblue">
  <h2><b>ProjectID Creation</b></h2>
  <div class="panel-group" id="accordion">
    <div class="panel panel-default">
      <div class="panel-body text-center">
        <div class="row">
          <div class="col-sm-4 form-group col-md-4 col-xs-12 col-lg-offset-4 col-sm-offset-4">
            <div class="form-group">
              <label id="label" class="control-label" >UserID:</label>
              <input type="text" class="form-control" name="user" ng-model="user" placeholder="Enter UserID" autocomplete="off" required />
            </div>
          </div>
        </div>
        <div class="row">
          <div class="col-sm-4 form-group col-md-4 col-xs-12 col-lg-offset-4 col-sm-offset-4">
            <div class="form-group">
              <label id="label" class="control-label">ProjectID:</label>
              <input type="text" class="form-control" name="project" ng-model="project" placeholder="Enter ProjectID" autocomplete="off" required />
            </div>
          </div>
        </div>
        <div class="temp123" style="margin-bottom:60px">
          <button type="submit" class="btn btn-primary" ng-click="create()">Create</button>
          <button type="clear" class="btn btn-default" ng-click="clear()">Clear</button>
        </div>
      </div>
    </div>
  </div>
</div>

＆＃13;

Answer 2

就是这样，

std::swap(name[i], name[i + 1]);

在这里演示：https://jsfiddle.net/durtpwvx/

将标签和文本框对齐到html的中心

2 个答案: