<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css"> <link rel="stylesheet" href="node_modules/sweetalert2/dist/sweetalert2.min.css"> </head> <body> <div class="jumbotron" style="background-color:peru"> <div class="row"> <div class="col-lg-4 text-center"> <img src="img/logo1.png" width="150" height="150"> </div> <div class="col-lg-8"> <H1> วิชาหัวข้อพิเศษ </H1> <h4> คำอธิบายรายวิชา </h4> <p> หัวข้อพิเศษทางการจัดการสารสนเทศที่เป็นที่สนใจและสำคัญในขณะนั้นและที่เกี่ยวข้อง หัวข้อและเนื้อหาเปลี่ยนไปในแต่ละปี และแต่ละกลุ่มที่เรียน โดยได้รับความเห็นชอบจากหัวหน้าสาขาและคณะบดี </p> </div> </div> </div> <div class="container"> <h1 class="text-danger"> หัวข้อศึกษาในในรายวิชาหัวข้อพิเศษ </h1> <p class="text-info" > เนื้อหาการเรียนประกอบด้วย : </p> <p class="text-primary"> บทที่ 1 </p> - Bootstrap 4 Get Started <br> - Bootstrap 4 Grids <br></br> <p class="text-primary"> บทที่ 2 </p> - Bootstrap Text / Typography <br> - Bootstrap 4 Color <br> - bootstrap 4 Tables <br></br> <p class="text-primary"> บทที่ 3 </p> - Bootstrap 4 Images <br> - Bootstrap 4 Jumbotron <br> - Bootstrap 4 Alert <br> - Sweet Alerts 2 <br><br> <h3> การจัดการรูปภาพ </h3> <br> </div> <div class="container"> <div class="row"> <div class="col-lg-4 text-center"> <img src="img/11.jpg" class="rounded" width="300" height="300" alt=""> </div> <div class="col-lg-4 text-center"> <img src="img/12.jpg" class="rounded-circle" width="300" height="300" alt=""> </div> <div class="col-lg-4 text-center"> <img src="img/13.jpg" class="img-thumbnail" alt=""> </div> </div> </div> <br><br> <div class="container"> <h2> รายชื่อนักศึกษา </h2> <p> นักศึกษาที่ลงทะเบียนเรียนวิชาหัวข้อพิเศษ ภาคเรียนที่ 2/2561 </p> <div class="table-responsive-sm"> <table class="table table-striped table-bordered table-hover table-sm "> <thead> <tr class="table-success"> <th> รหัสนักศึกษา </th> <th> ชื่อ-นามสกุล </th> <th> Email </th> </tr> </thead> <tbody> <tr> <td> 6062110004 </td> <td> สุขสันต์ ยะประพันธ์ </td> <td> [email protected] </td> </tr> <tr> <td> 6062110003 </td> <td> ปริทัศน์ โตอ่อน </td> <td> [email protected] </td> </tr> <tr> <td> 6062000000 </td> <td> นิตยา ทาชาติ </td> <td> [email protected]</td> </tr> </tbody> </table> </div> <div class="container"> <h2> การใช้งาน sweetalert2 </h2> <div class="container"> <button type="button" class="btn btn-info" onclick="swalfunction()">การแจ้งเตือนที่ 1</button> <button type="button" class="btn btn-info" onclick="swalfunction2()">การแจ้งเตือนที่ 2</button> </div> <script src="node_modules/jquery/dist/jquery.min.js"></script> <script src="node_modules/popper.js/dist/umd/popper.min.js"></script> <script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script> <script src="node_modules/sweetalert2/dist/sweetalert2.min.js"></script> <script> function swalfunction() { Swal.fire({ title: 'การแจ้งการทำงานของระบบ', text: 'คุณได้ดำเนินการเขียนโปรแกรมการแจ้งเตือนด้วย Sweetalert 2 สำเร็จแล้ว', type: 'success', confirmButtonText: 'OK' }) } </script> <script> function swalfunction2() { Swal.fire({ title: 'คุณต้องการปิดหน้าจอหรือไม่ ?', text: "คุณแน่ใจหรือไม่ที่ต้องการปิดหน้าจอนี้", type: 'warning', showCancelButton: true, confirmButtonColor: '#3085d6', cancelButtonColor: '#d33', confirmButtonText: 'ใช่ , ฉันต้องการ' }) } </script> <br><br><br></br> </body> </html>
We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy. Accept Learn more
