PHP无法从HTML表单中选择数据

My PHP page is unable to pick values from HTML form. It's sending blank strings to database. Here is my HTML and PHP code. Please find error. I am new to PHP, unable to solve the problem.

my html page:
    <!DOCTYPE html>

    <html >
     <head>
       <meta charset="UTF-8">

       <title>LOGIN</title>



        <link rel="stylesheet" href="css/reset.css">


      <link rel='stylesheet prefetch' href='http://fonts.googleapis.com/css?family=Roboto:400,100,300,500,700,900|RobotoDraft:400,100,300,500,700,900'>

    <link rel='stylesheet prefetch' href='http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css'>


        <link rel="stylesheet" href="css/style.css">






      </head>



    <body>



    <!-- Mixins-->
    <!-- Pen Title-->

    <div class="pen-title">

    <h1>SYNCHPHONY</h1>
    </div>
    <div class="rerun"><a href="">Rerun Pen</a></div>
    <div class="container">

     <div class="card"></div>
      <div class="card">

       <h1 class="title">Login</h1>

     <form name="login" action="login.php" method="POST">

        <div class="input-container">

       <input type="text" id="loginid" required="required"/>


     <label for="loginid">Login ID</label>

        <div class="bar"></div>
          </div>

      <div class="input-container">


      <input type="password" id="password" required="required"/>

         <label for="password">Password</label>

      <div class="bar"></div>
          </div>

       <div class="button-container">

      <button><span>Go</span></button>
          </div>


      </form>

      </div>

    <div class="card alt">
        <div class="toggle"></div>

      <h1 class="title">Register

    <div class="close"></div>
        </h1>

       <form name="register" action="register.php" method="POST">

     <div class="input-container">

         <input type="text" id="loginid" required="loginid"/>

        <label for="loginid">Login ID</label>

    <div class="bar"></div>
          </div>

        <div class="input-container">

        <input type="password" id="password" required="required"/>

     <label for="password">Password</label>

     <div class="bar"></div>
          </div>


    <div class="button-container">

        <button value'submitb'><span>Next</span></button>
          </div>

      </form>

     </div>
    </div>


        <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>

            <script src="js/index.js"></script>



      </body>
    </html>

my php page:

**strong text**    <?php
    $servername = "localhost";
    $username = "root";
    $password = "";
    $dbname = "syncphony";
    $loginid="";
    $password="";
    // Create connection
    $conn = new mysqli($servername, $username, $password, $dbname);
    // Check connection
    if ($conn->connect_error) {
        die("Connection failed: " . $conn->connect_error);
    } 

    if(isset($_POST['loginid'])){ $loginid = $_POST['loginid']; }
    if(isset($_POST['password'])){ $password = $_POST['password']; }

    // Escape user inputs for security
    $loginid = mysqli_real_escape_string($conn,$loginid);
    $password = mysqli_real_escape_string($conn,$password);

    // attempt insert query execution
    $sql = "INSERT INTO users (loginid, password ) VALUES ('$loginid', '$password')";
    if(mysqli_query($conn, $sql)){
        echo "Records added successfully.";
    } else{
        echo "ERROR: Could not able to execute $sql. " . mysqli_error($conn);
    }

    // close connection
    mysqli_close($conn);
    ?>

The inputs inside your form tag do not have names. Try this for login:

<input type="text" id="loginid" required="required" name="loginid"/>

and this for password:

<input type="password" id="password" required="required" name="password"/>

It would be nice if you would protect your users against XSS attacks and to use encryption when you store a password. Also, you should structure your code and make sure your HTML is valid.