Breaking

PHP and MySql CRUD Operations by Using Bootstrap

Once again I am back with another interesting tutorial about PHP. This is my first PHP tutorial hope you will enjoy it. Before starting this tutorial you should have basic understanding of  HTML, CSS and PHP itself. For this tutorial you will need some php file where will be some html code and you can find that code from below.

Initial files for this project

Index.php

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Football Players</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <style>
    @import url('https://fonts.googleapis.com/css?family=Crimson+Text&display=swap');
    @import url('https://fonts.googleapis.com/css?family=Noto+Serif+SC&display=swap');
        body{
            /* font-family: 'Crimson Text', serif; */
            background-image: url(img/nature.jpg);
            font-family: 'Noto Serif SC', serif;
            width: 100%;
            height: 100%;
            background-position: center;
            background-size: cover;
            background-repeat: no-repeat;
        }
        label, h2{
            color: white !important;
        }
    </style>
</head>
<body>
  <div class="navbar navbar-expand-lg navbar-dark bg-dark mb-5">
      <a href="#" class="navbar-brand"> <b> Players CRUD </b></a>
      <div class="container">
          <div class="collapse navbar-collapse" id="navbarNav">
              <ul class="navbar-nav">
                  <li class="nav-item"><a href="#" class="nav-link">Home</a></li>
                  <li class="nav-item"><a href="#" class="nav-link">About</a></li>
                  <li class="nav-item"><a href="#" class="nav-link">Contact</a></li>
                  <li class="nav-item"><a href="#" class="nav-link">Blog</a></li>
                  <li class="nav-item"><a href="#" class="nav-link">Faq</a></li>
              </ul>
          </div>
      </div>

  </div>


  <div class="container mt-5 shadow p-5">
      <h2 class="text-center">Enter Players Information</h2>
      <br>
      <form action="" method="post">
          <div class="form-row">
              <div class="col">
                  <div class="form-group">
                      <label for="name">Player Name</label>
                      <input type="text" class="form-control" name="" placeholder="Enter player name !">
                  </div>
              </div>
              <div class="col">
                  <div class="form-group">
                      <label for="marketVlu">Market Value</label>
                      <input type="text" class="form-control" name="" placeholder="Enter Market Value !">
                  </div>
              </div>
          </div>
          <div class="form-row">
              <div class="col">
                  <div class="form-group">
                      <label for="position">Position</label>
                      <input type="text" class="form-control" name="" placeholder="Enter player position !">
                  </div>
              </div>
              <div class="col">
                  <div class="form-group">
                      <label for="club">Market Value</label>
                      <input type="text" class="form-control" name="" placeholder="Enter Club Name !">
                  </div>
              </div>
          </div>
          <div class="form-group">
              <input type="submit" class="btn btn-primary form-control" name="">
          </div>
      </form>

      <br><br>
      <table class="table text-white bg-dark">
          <thead>
              <th>Name</th>
              <th>Market Value</th>
              <th>Position</th>
              <th>Club</th>
              <th>Action</th>
          </thead>
          <tbody>
            <tr>
                  <td>Erling Haaland</td>
                  <td>120</td>
                  <td>Forward</td>
                  <td>Borussia Dortmund</td>
              </tr>
          </tbody>
      </table>
  </div>
  <footer class="footer bottom-fixed container-fluid bg-dark text-white text-center">
      <p> © Copyright include to Md Samsuzzoha</p>
  </footer>
  <script src="js/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  </body>
  </html>



Get image


1 comment:

  1. As claimed by Stanford Medical, It is indeed the one and ONLY reason this country's women live 10 years more and weigh 19 kilos lighter than us.

    (And by the way, it has absolutely NOTHING to do with genetics or some hard exercise and EVERYTHING related to "how" they eat.)

    BTW, I said "HOW", not "WHAT"...

    Tap this link to reveal if this brief test can help you find out your true weight loss potential

    ReplyDelete

Powered by Blogger.