Belajar CSS Dasar(Membuat Form Dengan CSS) -Praktikum 11

-

Assalamualaikum WR.WB

Hai,ketemu lagi di blog saya,Pada postingan kali ini saya akan memberikan tutorial tentang cara menghias  ataupun memperindah tampilan form dengan CSS.Untuk lebih jelasnya,kita langsung saja ke materi nya.

 1.ExternalCSSOnForm1

Codingan HTML:



Codingan CSS:



Pembahasan:

Nah,Lagi lagi kita menggunakan external css,artinya file html dan file css nya terpisah
untuk property yang digunakan sama dengan postingan postingan sebelumnya seperti form,dan textarea.Berikut Output codingan diatas:



2.ExternalCSSonForm2

Codingan HTML:



 Codingan CSS:



Pembahasan:

Nah,Lagi lagi kita menggunakan external css,artinya file html dan file css nya terpisah
untuk property yang digunakan sama dengan postingan postingan sebelumnya seperti form,dan textarea.Berikut Output codingan diatas:




3.ExternalCSSonForm3

Codingan HTML:



Codingan CSS:



Pembahasan:

Nah,Lagi lagi kita menggunakan external css,artinya file html dan file css nya terpisah
untuk property yang digunakan sama dengan postingan postingan sebelumnya seperti form,dan input  yang berfungsi untuk memasukkan data.Berikut Output codingan diatas:




4.ExternalCSSonButton

Codingan HTML:



 Codingan CSS:

 

Pembahasan:

Nah,Lagi lagi kita menggunakan external css,artinya file html dan file css nya terpisah
untuk property yang digunakan sama dengan postingan postingan sebelumnya seperti form,dan input yang berfungsi untuk memasukkan data.Berikut Output codingan diatas:



5.ExternalCSSonHoverButton

Codingan HTML:




Codingan CSS:
 
 

Pembahasan:

Sebelumnya,Hover adalah suatu perubahan yang terjadi ketika mouse kita arahkan ke suatu objek,jadi saat kita mendekatkan kursor kr objek maka objek bisa membesar,mengecil,dll.Untuk propery nya hampir sama dengan codingan sebelumnya.Berikut output dari codingan diatas:





 6.ExternalCSSonRadioButton

Codingan HTML:


 Codingan CSS:



Pembahasan:

Nah,Lagi lagi kita menggunakan external css,artinya file html dan file css nya terpisah
untuk property yang digunakan sama dengan postingan postingan sebelumnya seperti form,dan input yang berfungsi untuk memasukkan data.Berikut Output codingan diatas:
 



PraktikumTugas

Codingan HTML:



Codingan CSS:



Hasil codingan diatas:





Nah,mungkin cukup sekian postingan kali ini,semoga bermanfaat bagi kita semua.Dan mohon maaf apabila banyak kesalahan dalam menyusun postingan ini.

Wassalamualaikum WR.WB
















Komentar

Posting Komentar

Postingan populer dari blog ini

Laravel : Create Data, Validation, dan Old Input

-
Gambar
Assalamualaikum WR.WB     Hai! kembali lagi ke blog saya,pada postingan kali ini saya akan memberikan materi Laravel yaitu Membuat data di Laravel (Create Read Update Delete)  atau disebut juga dengan CRUD.Nah mari kita langsung ke pembahasannya!      Di postingan  sebelumnya , kita telah membuat beberapa tabel diantaranya tabel siswa dan juga kelas, jadi sekarang kita akan membuat create data di tabel siswa caranya sebagai berikut: 1. Buat link untuk menghubungkan form utama dengan form tambah data buka file  resources/views/belajar.blade.php  kemudian tambahkan ini di bawah tulisan data siswa <a class="btn btn-sm btn-success" href="{{ url('/siswa/create') }}">Tambah Data</a> 2. Ubah Routes buka file file  routes/web.php  lalu tambakan Route::get('/siswa/create','SiswaController@create'); 3. Menampilkan view dengan nama form yang terdapat pada folder siswa buka file  app/Http/Controllers/SiswaControlle
Baca selengkapnya

Belajar PHP (Nested Looping) -Praktikum 24

-
Gambar
Assalamualaikum WR.WB Hai!Kembali lagi ke blog saya,pada postingan kali ini saya akan memberikan tutorial menggunakan Nested Loop di PHP.Tapi sebelum kita ke materi apa sih yang disebut Nested Loop? Pengertian Nested Loop 1. Nested Looping Nested Looping adalah istilah dimana kita menggunakan beberapa kali pengulangan dalam 1 codingan, istilahnya tidak jauh berbedadengan Nested If . Seperti yang telah kita ketahui, jenis jenis pengulangan ada 3, yaitu : For, While, dan Do - While. Dalam Nested Looping kita dapat menggunakannya dengan bersamaan, sekarang saya akan mencontohkan penggunakan Nested Looping. <html> <head> <title> Ammar taradifa - XI RPL 3</title> </head> <link href="Loop.css" rel="stylesheet" type = "text/css" > <body> <center> <?php $jumlah = 5; for ($i = 1; $i <= $jumlah; $i++) { for ($j = 1; $j <= $i; $j++) { echo 'X'; }
Baca selengkapnya

Program Menentukan Hari Menggunakan If Dan Switch Case dan

-
Gambar
Assalamualaikum WR WB Pada postingan akan kali ini saya akan membahas program untuk menentukan kode hari dan menentukan kelulusan seseorang. 1. Program Menentukan Hari If Program ini akan menentukan hari berdasarkan kode yang user input,yang nanti akan dieksekusi oleh program.contohnya user menginput angka 7 maka program akan mengoutput hari senin. Berikut codingan programnya: Jadi apabila user menginput kode dari 1 - 7  maka program akan mengoutput dari hari minggu - hari senin.Berikut rincianya: -Kode 1 = Hari Minggu -Kode 2 = Hari Senin -Kode 3 = Hari Selasa -Kode 4 = Hari Rabu -Kode 5 = Hari Kamis -Kode 6 = Hari Jumat -Kode 7 = Hari  Sabtu  Berikut hasil programnya: 2. Program Menentukan Hari Switch Case Program ini sama seperti program di atas akan tetapi kali ini menguunakan switch case,Apa itu switch case? Switch-case merupakan pernyataan yang dirancangan khusus untuk menangani pengambilan keputusan yang melibatkan sejumlah atau banyak alternatif
Baca selengkapnya