Postingan lainnya

meletakkan tulisan dibawah gambar

 <?php
    include "koneksi/konek.php";
    $query=mysqli_query($link,"select * from gambar");
    if(mysqli_num_rows($query)>0){
      while($output=mysqli_fetch_assoc($query)){
        ?>

      <img src="image/picture/<?php echo $output['nama_gambar']; ?>"/>

        <?php echo $output['gambar'];?>
        <?php

      }
      }
    ?>

maaf mengganggu saya mau tanya, saat saya masukin gambar tetapi saya maunya itu tulisannya berada dibawah gambarx itu bagaimanax?soalx saya buat kodingan seperti diatas malah disampingnya bukan dibawahnya gambar!mohon infonya master

php database

@amstar

40 Kontribusi 2 Poin

Diperbarui 6 tahun yang lalu

5 Jawaban:

Gunakan CSS atau Bootstrap, mainkan kolom dan text-center Kak

@muabazalm

3 Kontribusi 1 Poin

Dipost 6 tahun yang lalu


      <img src="image/picture/<?php echo $output['nama_gambar']; ?>"/>
<br />
        <?php echo $output['gambar'];?>

kasih <br /> kan simple gan? kalau mau dia auto pakai

 <img style="float:none" src="image/picture/<?php echo $output['nama_gambar']; ?>"/>

@uzzielpelawak

72 Kontribusi 21 Poin

Dipost 6 tahun yang lalu

ini yang menggunakan

ini yang tidak menggunakan

tapi kenapax tetap tidak bisa sesuai yang diharapkan?

@amstar

40 Kontribusi 2 Poin

Dipost 6 tahun yang lalu

Coba ini


<html>
<head>
<style>
div.gallery {
    margin: 5px;
    border: 1px solid #ccc;
    float: left;
    width: 180px;
}

div.gallery:hover {
    border: 1px solid #777;
}

div.gallery img {
    width: 100%;
    height: auto;
}

div.desc {
    padding: 15px;
    text-align: center;
}
</style>
</head>
<body>

<div class="gallery">

    <img src="gambar-pertama.jpg" alt="gambar-pertama" width="300" height="200">

  <div class="desc">keterangan gambar</div>
</div>

<div class="gallery">

    <img src="gambar-kedua.jpg" alt="gambar-kedua" width="300" height="200">

  <div class="desc">keterangan gambar</div>
</div>

<div class="gallery">

    <img src="gambar-ketiga.jpg" alt="gambar-ketiga" width="300" height="200">

  <div class="desc">keterangan gambar</div>
</div>

<div class="gallery">

    <img src="gambar_keempat.jpg" alt="gambar-keempat" width="300" height="200">

  <div class="desc">keterangan gambar</div>
</div>

</body>
</html>

@uzzielpelawak

72 Kontribusi 21 Poin

Dipost 6 tahun yang lalu

Pakai bootstrap saja mas

 <!DOCTYPE HTML>
<html lang="en">
<head>
  <title>Contoh gambar dan tulisan di bawahnya  </title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>
<!--container mulai disini -->
<div class="container">
  <h1>Judul </h1>
     <!-- mulai row di sini-->
    <div class="row">
    <div class="col-md-4">
      <div class="thumbnail">
          <img class="thumbnail" src="alamat_gambar1.jpg" alt="Gambar1" width="410" height="382">
          <div class="caption">
            <p>Nama Gambar 1.  </p>
          </div>
      </div>
    </div>

    <div class="col-md-4">
      <div class="thumbnail">
          <img class="thumbnail" src="alamat_gambar2.jpg" alt="Gambar2" width="410" height="382">
          <div class="caption">
            <p>Nama Gambar 2.</p>
          </div>
      </div>
    </div>

    <div class="col-md-4">
      <div class="thumbnail">
         <img class="thumbnail" src="alamat_gambar3.jpg" alt="Gambar3" width="410" height="382">
          <div class="caption">
            <p>Nama Gambar 3.</p>
          </div>
      </div>
    </div>
  </div> <!--row akhir di sini-->
</div> <!-- container akhir disini-->

</body>
</html>

@VikSintus

96 Kontribusi 36 Poin

Dipost 6 tahun yang lalu