Langsung ke konten utama

Form LOGIN dengan CSS & Bootstrap

Form Login, biasanya digunakan untuk membatasi hak akses bagi user untuk melihat dan berinteraksi dengan data. Tutorian kali ini akan membahas tentang bagaimana membuat form Login sederhana dengan CSS dan Bootstrap.

Hal-hal yang dibutuhkan sebagai berikut:
  • Text Editor, kalian bisa menggunakan Atom, notepad++, sublime, atau IDE netbeand. Tapi tutorial kali ini saya akan menggunakan sublime.
  • Browser: Chrome, Firefox, IE atau Safari.
  • XAMPP
  • Bahasa Pemrograman: HTML5

                                                                                Tampilan Form Login Sederhana

  1. Pastikan xampp: apache distart.
  2. Buat folder baru dengan nama login didirektori C:\xampp\htdocs.
                                         
                                                           
                                                                                                  gambar forlder
  3. Jangan lupa ya download bootstrap dulu di getbootstrap.com
  4. Ekstrak Bootstrap yang sudah didownload, kemudian pindahkan css, js dan fonts kefolder assets. Hasilnya seperti gambar diatas
  5. Buat file index.php untuk form login. Berikut syntax file index.php

                                syntak login
  6. Jika sudah kalian bisa cek dengan mengakses localhost/login
oke, demikian tutorial kali ini, jika ada error atau pertanyaan bisa kalian tinggalkan dikolom komentar.👌😄😄
Sekian dan selamat belajar.

Komentar

Postingan populer dari blog ini

Belajar HTML5

oke gengs,,,setelah kemarin sempat upload belajar php sekarang saya kembali membuat tutorial sederhana nih, yaitu belajar HTML5,,, Apa Sih itu HTML5??? HTML5 adalah sebuah bahasa markas untuk menstrukturkan dan menampilkan isi dari waring wera wenua, sebuah teknologi inti dari Internet. HTML5 adalah revisi kelima dari HTML (yang pertama kali diciptakan pada tahun 1990 dan versi keempatnya yaitu HTML4 pada tahun 1997) dan hingga bulan juni 2011 masih dalam pengembangan. lebih jelasnya bisa kunjungi  https://id.wikipedia.org/wiki/HTML5 jadi sebelum itu kita persiapkan dulu software atau editornya nih teman-teman, saya menggunakan sublime text bisa didownload di  www.sublimetext.com . kalian juga bisa menggunakan editor lain nih, seperti: notepad++, adobe DreamWeaver, atom dan masih banyak lagi yang lainnya. kita mulai saja tutorialnya dari yang paling dasar yukkzzzz😊 Contoh sederhana halaman html Hasilnya: DASAR-DASAR HTML 1. Tipe dokumen html ...

PHP Daftar Pemesanan Hardware Komputer

Program Pemesanan Hardware Komputer dengan PHP dan HTML //Inisialisasi variable yang digunakan  //nama peralatan  $mainboad ="Mainboard";  $processor ="Processor";  $ram = "Ram";  $hardisk = "Hardisk";  //harga perunit peralatan  $harga_mainboard = $_POST['harga_mainboard'];  $harga_processor = $_POST['harga_processor'];  $harga_ram = $_POST['harga_ram'];  $harga_hardisk = $_POST['harga_hardisk'];  //jumlah peralatan yang ada  $jumlah_mainboard = $_POST['jumlah_mainboard'];  $jumlah_processor = $_POST['jumlah_processor'];  $jumlah_ram = $_POST['jumlah_ram'];  $jumlah_hardisk = $_POST['jumlah_hardisk'];  //total harga per jenis peralatan  $total_mainboard = $jumlah_mainboard * $harga_mainboard;  $total_processor = $jumlah_processor * $harga_processor;  $total_ram = $jumlah_ram * $harga_ram;  $total_hardisk = $jumlah_hardisk * $harga_hardisk;  //hitung peralat...