Borderless Table Pada Framework CSS Materialize

Selamat datang kembali di laman tips dan trik Source Code Aplikasi, kembali lagi dengan saya pada pembahasan framework css materialize. Di kesempatan kali ini saya akan memberikan tips mengenai Borderless Table Pada Framework CSS Materialize dan saya akan memberi tahu beberapa guna di pada sistem Borderless Table  diantaranya bordered, striped. highlight, responsive-table dan centered. Dimana pada sistem ini kita hanya memberikan class nya saja di tag table nya. Di bawah ini keterangan dari hasil sistem table



Secara default table mempunyai tampilan seperti gambar di bawah ini



Selamat




  • bordered: Mempunyai output border-botom di setiap tag tr


  • striped : Mempunyai output bergaris dan ada background secara berselang – seling


  • highlight : Mempunyai efek hover di setiap tar tr nya


  • centered : Mempunyai output konten akan ke posisi center atau tengah


  • responsive-table : Mempunyai output terdapat scroll bottom secara horizontal



Bagus seketika saja saya akan implementasikan Borderless Table Pada Framework CSS Materialize di gambar di bawah ini saya mempunyai sebuah script tabel dan juga isinya



Selamat



Kemudian saya akan membeikan class di tag table nya



Selamat



Hasil output dari class bordered



Selamat



Hasil output dari class bordered dan striped 



Selamat



Hasil output dari class highlight yang mempunyai hover ketika mouse di arahkan di setiap kolom



Selamat



Hasil output dari class centered



Selamat



Hasil ouput dari class responsive-table, ketika posisi mobile table title akan keposisi samping kiri dan penjelasan secara horizontal dan ada scroll bottom nya bagi melihat detail penjelasan nya.



Nah berikut yaitu hasil efek yang di hasilkan dari beberapa class bagi table yang di sediakan oleh framework ini, bagi berikutnya teman – teman tinggal implementasikan di setiap class nya dan melihat hasil outputnya bagi tahu mana yang cocok bagi layout yang kalian akan bikin. Bagus, demikianlah di artikel kali ini mengenai Borderless Table Pada Framework CSS Materialize kita akan lanjut di pembahasan frame materialize ini. Gampang – mudahan bermanfaat dan semoga dapat menjadi tambahan ilmu bagi teman – teman, terimakasih dan hingga jumpa.




Sumber https://kursuswebsite.org

Popular posts from this blog

Perbedaan Antara Keyup dan Keydown Pada jQuery

Even di javascript adalah sebuah suatu yang terjadi di element tertentu, maksudnya yaitu suatu respon atau aksi yang di lakukan oleh user dimana kegiatan tersebut akan memicu jalannya script javascript yang terdapat di blog tersebut. Di javascript terdapat banyak event namun di pembahasan kali ini kita akan membahas mengenai Perbedaan Antara Keyup dan Keydown Di jQuery, Keyup adalah sebuah event yang akan di jalankan ketika tombol dilepaskan di di keyboard, dan sedangkan Keydown adalah sebuah event ketika tombol ditekan di keyboard.
Read more

Membuat Table Warna Berselang dengan PHP

Image
Selamat datang di blog Source Code Aplikasi, masih dengan File yang kemarin, tapi sekarang ini kita akan menggunakan Framework Bootstrap dan Membangun Table Warna Berselang dengan PHP, jadi jangan lupa yang kemarin praktekin dulu yah teman teman link nya yang ini . oka seketika saja kita praktekan.
Read more