เว็บผมทำจาก Bootstrap ใกล้จะเสร็จแล้วล่ะครับ เหลือแค่ขยับรายละเอียดนิดๆหน่อยๆ
ประเด็นคือผมไม่ได้ใช้ Theme ของ Bootstrap เลยครับ เพราะผมใช้รูปแบบหน้าเว็บของผมเอง
การสร้างเว็บด้วย Bootstrap ผมต้องรื้อเอาความรู้ html แบบเก่าๆ ทิ้งไปเกือบหมด แล้วมาเริ่มรู้จักกับ Bootstrap html5 ใหม่
ต้องไม่มีแท็ก <table>, <td>, <tr>, <iframe> แต่จะเน้นแท็ก <div>, <p>, <span> ล้วนๆ
สิ่งที่ทำให้หน้าเว็บยืดหดได้ ตามขนาดของหน้าจอ คอม->แท็บเล็ต->มือถือ ก็คือคำสั่ง container-fluid
แต่ทีนี้ผมไม่แน่ใจว่าการเรียกใช้ Bootstrap แบบดึงมาจากในเว็บเรา กับการเรียกใช้ผ่านเว็บไซต์ภายนอก ต่างกันหรือไม่ครับ (ตัวอย่างโค้ด)
1.แบบดึงภายในเว็บเรา เพราะส่วนมากหลายสำนักบอกให้ไปโหลด Bootstrap, Jquery มาลงในเครื่องเราก่อน (ผมเลยสร้างเว็บจากวิธีนี้ก่อนเหมือนกัน)
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>เว็บไซต์</title>
<meta name="description" content="a b c x y z">
<meta name="keywords" content="1,2,3,4,5,6">
<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/styles.css" type="text/css">
</head>
<body>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<div class="container-fluid">
.....
</div>
</body>
</html>
2.แบบเรียกใช้จากเว็บไซต์ภายนอก ตอนหลังผมมาเห็น w3school ใช้แบบนี้ครับ
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1" />
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>เว็บไซต์</title>
<meta name="description" content="a b c x y z">
<meta name="keywords" content="1,2,3,4,5,6">
<link rel="stylesheet" href="
http://maxcdn.bootstrapcdn.com...ap/3.3.7/css/bootstrap.min.css 
">
<link rel="stylesheet" href="css/styles.css" type="text/css">
</head>
<body>
<script src="
https://ajax.googleapis.com/aj...bs/jquery/1.12.4/jquery.min.js "></script>
<script src="
http://maxcdn.bootstrapcdn.com...trap/3.3.7/js/bootstrap.min.js "></script>
<div class="container-fluid">
.....
</div>
</body>
</html>
ผมเลยสงสัยว่าการเรียกใช้ Bootstrap ทั้ง 2 แบบนี้ มันใช้งานต่างกันมั้ยครับ ขอบคุณครับ
พัฒนาเว็บไซต์
