คีย์ลัด การใช้ Bootstrap 3 Snippets (บูทแสป สนิปเป็ท) ใน Sublimte Text 3 (ซับไลม์ แท็ก)

Microsoft Office Knowledge Word, Excel, powerpoint, line , โปรแกรมเสริมต่างๆ

Moderator: mindphp, ผู้ดูแลกระดาน

ภาพประจำตัวสมาชิก
moomai
PHP Super Hero Member
PHP Super Hero Member
โพสต์: 680
ลงทะเบียนเมื่อ: 07/12/2016 10:54 am

คีย์ลัด การใช้ Bootstrap 3 Snippets (บูทแสป สนิปเป็ท) ใน Sublimte Text 3 (ซับไลม์ แท็ก)

โพสต์โดย moomai » 01/02/2017 5:11 pm

คีย์ลัด การใช้ Bootstrap 3 Snippets (บูทแสป สนิปเป็ท) ใน Sublimte Text 3 (ซับไลม์ แท็ก)
Sublimte Text 3 (ซับไลม์ แท็ก) เป็นโปรแกรม Text Editor (อิดิเตอร์) ที่ใช้ในการเขียนโปรแกรม เว็บไซต์ อย่างหนึ่ง เราสามารถเพิ่มความรวดเร็วในการเขียนโปรแกรมง่ายๆด้วยการใช้คีย์ลัด

คีย์ลัด การใช้ Bootstrap 3 Snippets (บูทแสป สนิปเป็ท) ใน Sublimte Text 3 (ซับไลม์ แท็ก) มีดังนี้
1.ให้เราเปิดโปรแกรม Sublimte Text 3 (วับไลม์ แท็ก) ขึ้นมาแล้วเปิดไฟล์ จากนั้นเราต้องทำการติดตั้ง package (แพคเก็จ) ก่อน โดยกดคีย์บรอดแป้นพิมพ์ Shift+Ctrl+P (ชิป+คอนโทล+พี) พร้อมกัน แล้วพิมพ์ Package Control: Install Package แล้วกด Enter (เอ็นเทอร์) แล้วรอโปรแรกมทำการติดตั้งสักครู่
Screenshot (71).png
Screenshot (71).png (62.73 KiB) เปิดดู 138 ครั้ง

2.เมื่อทำการติดตั้งเสร็จแล้วให้เราพิมพ์ Bootstrap 3 Snippets (บูทแสป 3 สนิปเป็ท) ลงในกล่องข้อความแล้วกดเอ็นเทอร์ รอติดตั้งสักครู่
3.png
3.png (60.47 KiB) เปิดดู 138 ครั้ง

3.เมื่อเราทำการติดตั้งเสร็จแล้ว ก็มาเริ่มใช้ครีย์ลัดกันเลย โดยให้เราพิมพ์ bs3-template:html5 แล้วกด Tab (แท็ป) ที่คีย์บอร์ด
2.png
2.png (16.46 KiB) เปิดดู 138 ครั้ง

4.หลังจากกด Tab (แท็ป) แล้วเราก็จะได้โค้ด
4.png
4.png (45.88 KiB) เปิดดู 138 ครั้ง

5.จากนั้นเราก็ลบแบบด้านล่างออก

โค้ด: เลือกทั้งหมด

<h1 class="text-center">Hello World</h1>

6.เมื่อลบออกแล้วให้พิมพ์ bs3-navbar แล้วกดแท็ปที่คีย์บอร์ด
7.png
7.png (19.74 KiB) เปิดดู 138 ครั้ง

7.เมื่อกดแท็ปแล้วก็จะได้โค้ด ให้เราบันทึกไฟล์แล้วลองรันดู
8.png
8.png (41.88 KiB) เปิดดู 138 ครั้ง

8.เมื่อเรารันดูก็จะได้ตามนี้ โดยไท้ต้องพิมพ์โค้ดจำนวนมากๆเอง ใช้คีย์ลัดง่ายๆ
6.png
6.png (21.77 KiB) เปิดดู 138 ครั้ง
The truth is not as elegant as the idea.

  • Similar Topics
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ย้อนกลับไปยัง

ผู้ใช้งานขณะนี้

กำลังดูบอร์ดนี้: 3 และ บุคคลทั่วไป 0 ท่าน