Haloo! Selamat Datang di Komunitas Private Training Web Development (57121 Members, 641 Products, 4568 Topic, 12025 Comments)

Butuh karyawan baru? atau seorang Web Developer (Part-time/Freelance/Full-time), cari disini : Members Area Jobs!

Menampilkan gambar artikel swarakalibata seperti selang seling

Dibuat
Login Terakhir 7 Hari lalu,
Telah Dilihat 307 Kali
Ahmad Adzan Azari Mengatakan : Premium 
  1. Assalamualaikum Warahmatullahi Wabarakatuh... mau tanya saya ingin menampilkan artikel berita seperti gambar yang saya lampirkan itu gimana ya mas. mohon bantuannya?
Ada 1 File Kiriman :
1. Capture53.PNG (127 KB)

Ada 4 Jawaban

PHPMU.COM Support
commented on 20 Jul 2019 21:52:07		 
  1. Assalamualaikum,.. tinggal dikondisikan saja mas begini :
  2. if ($no%2==0){ $posisi = 'float:right'; }else{ $posisi = ''; }
  3. jadi pada division foto ditempel saja variable posisinya, 
  4. ex : <div style='$posisi' class='article-photo'>
  5.  
  6. hasilnya setelah saya cobakan pada swarakalibata Ci,
  7. bisa dilihat dari screenshot dibawah ini.
Terdapat 1 File dilampirkan :
1. swarakalibata_image_position.png (1 MB)
Ahmad Adzan Azari
commented on 20 Jul 2019 21:56:06		 
  1. Assalamualaikum,..  kalau misalnya menggunakan bootstrap coding htmlnya seperti ini gimana mas?
  2.  
  3. <section class="section bg-light" id="services">
  4.     <div class="container">
  5.         <div class="row">
  6.             <div class="col-lg-5">
  7.                 <img src="https://www.sonusfaber.com/wp-content/uploads/2019/06/FB_blogpost-2.jpg" style="width: 100%">
  8.             </div>
  9.             <div class="col-lg-7">
  10.             	<h4>Judul Label</h4>
  11.             	<p>Possiamo essere dovunque nel mondo, ma alcune canzoni ci riportano immediatamente in Italia. Diversi artisti, alcuni molto noti </p>
  12.             </div>
  13.         </div>
  14.         <div class="row" style="margin-top: 30px">
  15.             <div class="col-lg-7">
  16.                 <h4>Judul Label</h4>
  17.             	<p>Possiamo essere dovunque nel mondo, ma alcune canzoni ci riportano immediatamente in Italia. Diversi artisti, alcuni molto noti </p>
  18.             </div>
  19.             <div class="col-lg-5">
  20.             	<img src="https://www.sonusfaber.com/wp-content/uploads/2019/06/FB_blogpost-2.jpg" style="width: 100%">
  21.  
  22.             </div>
  23.         </div>
  24.         <div class="row" style="margin-top: 30px;">
  25.             <div class="col-lg-5">
  26.                 <img src="https://www.sonusfaber.com/wp-content/uploads/2019/06/FB_blogpost-2.jpg" style="width: 100%">
  27.             </div>
  28.             <div class="col-lg-7">
  29.             	<h4>Judul Label</h4>
  30.             	<p>Possiamo essere dovunque nel mondo, ma alcune canzoni ci riportano immediatamente in Italia. Diversi artisti, alcuni molto noti </p>
  31.             </div>
  32.         </div>
  33.         <p style="margin-top: 20px"><a href="#">Sea More Product >></a></p>
  34.     </div>
  35. </section>
PHPMU.COM Support
commented on 20 Jul 2019 22:05:52		 
  1. Assalamualaikum,.. jadinya nanti gini, perhatikan baris 15 :
  2. <section class="section bg-light" id="services">
  3.     <div class="container">
  4.         <div class="row">
  5.             <div class="col-lg-5">
  6.                 <img src="https://www.sonusfaber.com/wp-content/uploads/2019/06/FB_blogpost-2.jpg" style="width: 100%">
  7.             </div>
  8.             <div class="col-lg-7">
  9.             	<h4>Judul Label</h4>
  10.             	<p>Possiamo essere dovunque nel mondo, ma alcune canzoni ci riportano immediatamente in Italia. Diversi artisti, alcuni molto noti </p>
  11.             </div>
  12.         </div>
  13.  
  14.         <div class="row" style="margin-top: 30px">
  15.             <div class="col-lg-5 pull-right">
  16.                 <img src="https://www.sonusfaber.com/wp-content/uploads/2019/06/FB_blogpost-2.jpg" style="width: 100%">
  17.             </div>
  18.             <div class="col-lg-7">
  19.                 <h4>Judul Label</h4>
  20.             	<p>Possiamo essere dovunque nel mondo, ma alcune canzoni ci riportano immediatamente in Italia. Diversi artisti, alcuni molto noti </p>
  21.             </div>
  22.         </div>
  23.  
  24.         <div class="row" style="margin-top: 30px;">
  25.             <div class="col-lg-5">
  26.                 <img src="https://www.sonusfaber.com/wp-content/uploads/2019/06/FB_blogpost-2.jpg" style="width: 100%">
  27.             </div>
  28.             <div class="col-lg-7">
  29.             	<h4>Judul Label</h4>
  30.             	<p>Possiamo essere dovunque nel mondo, ma alcune canzoni ci riportano immediatamente in Italia. Diversi artisti, alcuni molto noti </p>
  31.             </div>
  32.         </div>
  33.         <p style="margin-top: 20px"><a href="#">Sea More Product >></a></p>
  34.     </div>
  35. </section>
Ahmad Adzan Azari
commented on 20 Jul 2019 22:18:48		 
  1. Assalamualaikum,.. ok mas terima kasih banyak
Maaf, Untuk Memberikan Komentar Anda Harus Login !!!