Tag Archives: วิธีเขียนเว็บ responsive

เริ่มต้นการสร้างเว็บ Responsive ด้วย Bootstrap

ในการเริ่มต้นเขียน เว็บไซต์แบบ Responsive นั้นสิ่งที่ต้องเรียนรู้ คือ HTML5 และ CSS3 ซึ่งหลายคนยังไม่อาจยังไม่ถนัด ในการเขียนในรูปแบบนี้ดังนั้นวันนี้ผมจะมาสอนเทคนิคการทำ เว็บไซต์แบบ Responsive ด้วยการเรียนรู้แบบ ติดไอพ่นกันเลยทีเดียว ขั้นแรกเรามารู้จักกับ Framework Bootstrap ซึ่งจะมาเป็นผู้ช่วยของเราในบทความนี้ Bootstrap  ถูกพัฒนาขึ้นด้วย twitter ของเรานี้เองครับโดยตัว Bootstrap จะรวบรวมคำสั่ง Java และ CSS ไว้เพื่อให้ง่ายต่อการดึงมาใช้ในรูปแบบ Class ต่างๆ จึงทำให้การจัดหน้าตาของเว็บไซต์ง่ายขึ้นและยังสามารถเขียน Class ของเราเข้ามาผสมการทำงานกับตัวของ  Bootstrap ได้ด้วยเช่นกัน ขั้นที่สอง เรามาติดตั้ง Bootstrap กันดีกว่า -ในการติดตั้ง  Bootstrap  สามาถโหลดได้ที่ http://twitter.github.io/bootstrap/ หลังจากที่โหลดมาเสร็จเราจะเอาไฟล์ที่ได้มาไปไว้ใน Root เดี๋ยวกับเว็บที่เราสร้างไว้ โดยเมื่อแตก ไฟล์มาจะได้ โฟล์เดอร์ดังนี้ เวลาใช้งานนั้นทำได้ง่ายๆเพียงแค่ เพิ่ม โค้ดลงไปใน html ที่เราสร้างไว้ยกตัวอย่างดังนี้นะครับ <!DOCTYPE html> <html> <head> <title>Bootstrap 101 Template</title> <meta name="viewport" content="width=device-width, ... Read More »