จะเขียน script ยังไงให้สามารถดึงรูปภาพมาจากฐานข้อมูลได้ และให้เรียงกัน 3 ภาพ ช่วยแนะนำด้วยนะคะ

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา จะเขียน script ยังไงให้สามารถดึงรูปภาพมาจากฐานข้อมูลได้ และให้เรียงกัน 3 ภาพ ช่วยแนะนำด้วยนะคะ

จะเขียน script ยังไงให้สามารถดึงรูปภาพมาจากฐานข้อมูลได้ และให้เรียงกัน 3 ภาพ ช่วยแนะนำด้วยนะคะ
นี่โค้ดที่เราเขียนแต่ยังไม่ได้เขียน script เข้าไป
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>นักเรียน</title>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
    <link rel="stylesheet" href="styleindex.css" />
    <style>
    h2 {
      line-height: 1.66;
      margin: 0;
      padding: 0;
      font-weight: bold;
      color: #222;
      font-family: th sarabun new;
      font-size: 26px; }
    .block-1 {
    width: 120px;
    height: 250px;
    margin: 20px;
    background: #204E5F;
    float: left;
    }
    .block-2 {
        width: 120px;
        height: 250px;
        margin: 20px;
        background: #79A7A8;
        float: left;
    }
    .block-3 {
        width: 120px;
        height: 250px;
        margin: 20px;
        background: #B7D7D8;
        float: left;
    }
    </style>
</head>
<body>
    <script src="js/jquery-1.11.0.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <!-- menu bootstrap header-->
 <nav class="navbar navbar-expand-lg navbar-light " style="background-color: #FF8984;">
  <a class="navbar-brand">
    <img src="http://angsila.cs.buu.ac.th/~58160704/project/picture/1.png" width="30" height="30" class="d-inline-block align-top" alt="">
    Sign Language
  </a>
 </nav>
    <nav class="navbar navbar-light ">
    <h2>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;บทเรียน</h2>
    <form class="form-inline ">
        <input class="form-control mr-sm-2" type="search" placeholder="ค้นหา..." aria-label="Search">
        <button class="btn btn-light" type="submit" style="background-color: #B7D7D8;">ค้นหา</button>
    </form>
    </nav>
    <br>
    <br>
    <center>
        <div class="container">
        <div class="card block-1" style="width: 20rem;">
            <img src="..." class="card-img-top" alt="Norway">
        <div class="card-body">
        <h5 class="card-title ">Card title</h5>
        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        <a href="#" class="btn btn-primary">บทที่1</a>
        </div>
        </div>
        <div class="card block-2" style="width: 20rem;">
            <img src="..." class="card-img-top" alt="...">
         <div class="card-body">
        <h5 class="card-title">Card title</h5>
        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        <a href="#" class="btn btn-primary">บทที่2</a>
        </div>
        </div>
        <div class="card block-3" style="width: 20rem;">
        <img src="..." class="card-img-top" alt="...">
        <div class="card-body">
        <h5 class="card-title">Card title</h5>
        <p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
        <a href="#" class="btn btn-primary">บทที่3</a>
        </div>
        </div>
        </div>
    </center>
</body>
</html>


SkYmU 14-02-2019 18:22:27

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1
ดูเนื้อหานี้เป็นแนวทาง

แนวทางประยุกต์ระบบ Grid จัดรูปแบบคอลัมน์ ใน Bootstrap 4 http://niik.in/880 
https://www.ninenik.com/content.php?arti_id=880 via @ninenik

รู้จักและใช้งาน Layout และ Grid System ใน Bootstrap 4 อย่างง่าย http://niik.in/872 


ninenik 14-02-2019







สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet
หรือ
Terms of Service | Privacy Policy
Author
2025 © Copyright ninenik.com. All rights reserved.
เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ