Membuat Looping Data CSS Pada PHP

Halo Dumenity, selamat datang kembali di website tips dan trik Dumet School. Berjumpa kembali dengan saya pada pembahasan tips seputar dunia website,pada kesempatan kali ini saya akan memberikan tips tentang Membuat Looping Data CSS Pada PHP dimana kita akan membuat sebuah data yang berisi kode – kode warna css dan kemudian kita akan loping dengan foreach lalu kita masukkan di dalam tag html nya.

Pertama kita buat folder di dalam htdocs nya dengan nama php dan buat berfile index.php, lalu di dalamnya kita ketikkan kode – kode css di dalam array php

$data = ['orange','gray', 'red', 'tomato', 'aqua', 'black'];

Jika sudah kita buat perintah looping dengan foreach, teman teman bisa lihat pada script di bawah ini

foreach ($data as $result) {
	echo $result.'<br/>';
}

Membuat Looping Data CSS Pada PHP

Jika sudah tampil kita tambahkan tag html nya, kali ini kita akan tambah tag ul dan li dan di dalamnya kita sisipkan css nya

foreach ($data as $result) {
	echo '<ul>';
		echo '<li>'.$result.'</li>';
	echo '</ul>';
}

Kita save terlebih dahulu dan jalankan lagi pada browsernya

Membuat Looping Data CSS Pada PHP

Terakhir kita tambahkan cssnya dan tambahkan fungsi ucwords() supaya pada huruf pertama akan di ubah menjadi huruh besar, ketikkan seperti di bawah ini

<?php 

$data = ['orange','gray', 'red', 'tomato', 'aqua', 'black'];


foreach ($data as $result) {
	echo '<ul>';
		echo '<li style="color:#fff; padding:10px; background-color:'.$result.'">'.ucwords($result).'</li>';
	echo '</ul>';
}

Jika sudah save dan jalankan kembali pada browsernya maka hasilnya seperti gambar di bawah ini

Membuat Looping Data CSS Pada PHP

Nah itulah Membuat Looping Data CSS Pada PHP bisa buat teman – teman belajar untuk terbiasa dengan PHP khususnya teman – teman yang baru belajar PHP. Bisa kita katakan latihan kali ini adalah perpaduan PHP dan DOM HTML merubah style css dengan bantuan PHP. Baik, sekian pada artikel kali dan tentu kita akan berjumpa kembali pada artikel yang akan datang. Terimakasih dan sampai jumpa.

DUMET School Author

DUMET School adalah tempat kursus website, kursus desain grafis, kursus digital marketing, kursus video editing dan kursus mobile apps terbaik di Jakarta dan Depok.

Leave a Reply

Your email address will not be published. Required fields are marked *