Hallo! Selamat Datang di Marketplace produk digital, Freelancer terbaik di indonesia (68997 Members, 789 Products, 4708 Topic, 13109 Comments)

Menampilkan gambar artikel swarakalibata seperti selang seling

Dibuat
Login Terakhir 11 Hari lalu,
Telah Dilihat 1706 Kali
Lawumedia Indonesia Mengatakan : Sultan Account
  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)
Lawumedia Indonesia
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>
Lawumedia Indonesia
commented on 20 Jul 2019 22:18:48
  1. Assalamualaikum,.. ok mas terima kasih banyak
Maaf, Untuk Memberikan Komentar Anda Harus Login !!!

Online