SlideShare a Scribd company logo
1 of 9
คำสั่งในกำรจัดหน้ำ
เอกสำรบนหน้ำเว็บเพจ
ชั้นมัธยมศึกษา กลุ่มสาระการงานพื้นฐานอาชีพและเทคโนโลยี
จัดทำขึ้นเพื่อใช้เป็นสื่อประกอบกำรเรียนกำรสอน โดย นำย อัศวิน ขัดชุ่มแสง
กำรตัดคำขึ้นบรรทัดใหม่ <br>
กำรตัดคำขึ้นบรรทัดใหม่ <br>
การตัดบรรทัดใหม่นั้นปรกติ web browser จะทาการตัดให้อยู่แล้ว แต่การตัดคา
ของ web browser จะตัดเมื่อแสดงผลไม่ได้ แต่ถ้าเราใส่คาสั่ง <br> เข้าไป web
browser จะตัดให้ทันที ซึ่งคุณอาจจาเป็นที่จะต้องตัดคาเป็นบรรทัดสั้นๆ
ชื่อแท็ก br
ตาแหน่งของแท็ก อยู่ภายใต้แท็ก <body>…</body>
รูปแบบ HTML <br> ข้อความที่ต้องการขึ้นบรรทัดใหม่
คำสั่ง <br>
กำรตัดคำขึ้นย่อหน้ำใหม่ <P>
การขึ้นย่อหน้าใหม่ด้วยแท็ก P จะแตกต่างจากการขึ้นบรรทัดใหม่ด้วยแท็ก br คือ การ
ขึ้นย่อหน้าใหม่มีการเว้นบรรทัดว่างไว้เพื่อให้ย่อหน้าใหม่ถูกแยกออกจากหน้าที่ผ่านมาได้
อย่างชัดเจน
Attribute
Align โดยมีค่าที่จะกาหนดได้ดังนี้
Center : จัดกลาง
Left : ชิดซ้าย
Right : ชิดขวา
รูปแบบการใช้คาสั่ง
<p>…..</p>
<p align= left | center | right>text</p>
คำสั่งไม่มีกำรตัดข้อมูลขึ้นบรรทัดใหม่ <nobr>
ความหมายของคาสั่ง เมื่อเราต้องการยกเลิกการตัดคาบนบราวเซอร์
ประเภทของ tag tag คู่
รูปแบบการใช้คาสั่ง <nobr>....................ข้อความ.......................</nobr>
กำรจัดรูปแบบเอกสำรตำมที่กำหนด <pre>
ความหมายของคาสั่ง เป็นคาสั่งที่ใช้จัดรูปแบบเอกสารตามที่กาหนดไว้ใน Notepad
(Preformatted)
ประเภทของ tag tag คู่
รูปแบบการใช้คาสั่ง <pre>....................ข้อความ.......................</pre>
คำสั่งกำหนดจุดให้บรำวเซอร์ตัดคำ <wbr>
ความหมายของคาสั่ง เป็นคาสั่งที่ใช้ร่วมกับแท็ก <nobr>…. </nobr> ใช้วางจุด
ตาแหน่งที่ต้องการตัดคาภายในแท็ก <nobr>…. </nobr>
ประเภทของ tag Tag เดี่ยว
รูปแบบการใช้คาสั่ง <wbr>ข้อความ
เส้นคั่นในแนวนอน
ชื่อแท็ก <hr>
<hr width="n" align="left/right/center" size="n"
noshade="noshade" color="สี" />
align - กำรจัดวำงตำแหน่งของเส้น
size , width - เป็นการกาหนดความยาวให้กับเส้น สามารถกาหนดเป็นทั้ง
pixels และ % โดยปกติถ้าไม่กาหนด เส้นจะยาวเต็มจอภาพ
noshade - ไม่ต้องแสดงเป็นแบบ 3 มิติ
color - ระบุสีของเส้น แสดงผลเฉพำะบน IE
กำรเขียนคำบรรยำย Soure code
กำรเขียนคำบรรยำย Soure code
ในส่วนของคาบรรยาย soure code นั้นจะไม่แสดงที่ web browser เราเขียนเพื่อ
บรรยายว่า sorce code ส่วนนี้ใช้ทาอะไร เพื่อความสะดวกเมื่อกลับมาแก้ไข sorce code
ในภายหลังเพราะเราอาจจาไม่ได้ว่าเราเขียนส่วนนี้ไว้เพื่ออะไร เพราะว่าจริงๆแล้ว
soure code ที่เราใช้งานจริงนั้นจะมีมากมายหลายร้อยบรรทัด ถ้าเราไม่เขียนบรรยายไว้
ก็ทาให้เสียเวลาในการหาส่วนที่เราต้องการจะแก้ไข
<!-- คาบรรยาย source code --!>
กิจกรรม
แบบฝึกหัดท้ำยบทที่ 3

More Related Content

Viewers also liked

Presentation ttc
Presentation ttcPresentation ttc
Presentation ttcTagTagCity
 
ความหมายและวิวัฒนาการของคอมพิวเตอร์
ความหมายและวิวัฒนาการของคอมพิวเตอร์ความหมายและวิวัฒนาการของคอมพิวเตอร์
ความหมายและวิวัฒนาการของคอมพิวเตอร์Beerza Kub
 
The Daily Buzz Coffee Index
The Daily Buzz Coffee IndexThe Daily Buzz Coffee Index
The Daily Buzz Coffee IndexTheDailyBuzz
 
The Effects of Intellectual Traits on Personality (Humanities 102)
The Effects of Intellectual Traits on Personality (Humanities 102)The Effects of Intellectual Traits on Personality (Humanities 102)
The Effects of Intellectual Traits on Personality (Humanities 102)Art Christian V. Dimla
 
บทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศ
บทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศบทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศ
บทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศBeerza Kub
 
การรีดผ้า(Ironing)
การรีดผ้า(Ironing)การรีดผ้า(Ironing)
การรีดผ้า(Ironing)Beerza Kub
 
การพับผ้า (Shirt folding)
การพับผ้า (Shirt folding)การพับผ้า (Shirt folding)
การพับผ้า (Shirt folding)Beerza Kub
 
หน่วยที่ 2 เรื่อง บ้านน่าอยู่
หน่วยที่ 2 เรื่อง บ้านน่าอยู่หน่วยที่ 2 เรื่อง บ้านน่าอยู่
หน่วยที่ 2 เรื่อง บ้านน่าอยู่Beerza Kub
 
Undestanding by design: A curriculum model - Principles of Teaching 1
Undestanding by design: A curriculum model - Principles of Teaching 1Undestanding by design: A curriculum model - Principles of Teaching 1
Undestanding by design: A curriculum model - Principles of Teaching 1Art Christian V. Dimla
 
ความหมาย ประวัติ ประเภทของคอมพิวเตอร์
ความหมาย ประวัติ ประเภทของคอมพิวเตอร์ ความหมาย ประวัติ ประเภทของคอมพิวเตอร์
ความหมาย ประวัติ ประเภทของคอมพิวเตอร์ Beerza Kub
 
Palanca Awardees in the Period of Activism - Philippine Literature Subject
Palanca Awardees in the Period of Activism - Philippine Literature SubjectPalanca Awardees in the Period of Activism - Philippine Literature Subject
Palanca Awardees in the Period of Activism - Philippine Literature SubjectArt Christian V. Dimla
 

Viewers also liked (12)

Presentation ttc
Presentation ttcPresentation ttc
Presentation ttc
 
ความหมายและวิวัฒนาการของคอมพิวเตอร์
ความหมายและวิวัฒนาการของคอมพิวเตอร์ความหมายและวิวัฒนาการของคอมพิวเตอร์
ความหมายและวิวัฒนาการของคอมพิวเตอร์
 
The Daily Buzz Coffee Index
The Daily Buzz Coffee IndexThe Daily Buzz Coffee Index
The Daily Buzz Coffee Index
 
The Effects of Intellectual Traits on Personality (Humanities 102)
The Effects of Intellectual Traits on Personality (Humanities 102)The Effects of Intellectual Traits on Personality (Humanities 102)
The Effects of Intellectual Traits on Personality (Humanities 102)
 
บทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศ
บทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศบทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศ
บทที่ 1ข้อมูลและเทคโนโลยีสารสนเทศ
 
การรีดผ้า(Ironing)
การรีดผ้า(Ironing)การรีดผ้า(Ironing)
การรีดผ้า(Ironing)
 
การพับผ้า (Shirt folding)
การพับผ้า (Shirt folding)การพับผ้า (Shirt folding)
การพับผ้า (Shirt folding)
 
หน่วยที่ 2 เรื่อง บ้านน่าอยู่
หน่วยที่ 2 เรื่อง บ้านน่าอยู่หน่วยที่ 2 เรื่อง บ้านน่าอยู่
หน่วยที่ 2 เรื่อง บ้านน่าอยู่
 
Undestanding by design: A curriculum model - Principles of Teaching 1
Undestanding by design: A curriculum model - Principles of Teaching 1Undestanding by design: A curriculum model - Principles of Teaching 1
Undestanding by design: A curriculum model - Principles of Teaching 1
 
Common mispronounce words in english
Common mispronounce words in englishCommon mispronounce words in english
Common mispronounce words in english
 
ความหมาย ประวัติ ประเภทของคอมพิวเตอร์
ความหมาย ประวัติ ประเภทของคอมพิวเตอร์ ความหมาย ประวัติ ประเภทของคอมพิวเตอร์
ความหมาย ประวัติ ประเภทของคอมพิวเตอร์
 
Palanca Awardees in the Period of Activism - Philippine Literature Subject
Palanca Awardees in the Period of Activism - Philippine Literature SubjectPalanca Awardees in the Period of Activism - Philippine Literature Subject
Palanca Awardees in the Period of Activism - Philippine Literature Subject
 

More from Beerza Kub

.Security Electric
.Security Electric.Security Electric
.Security ElectricBeerza Kub
 
ใบงานที่ 1-5 ม.1 1/61
ใบงานที่ 1-5 ม.1 1/61ใบงานที่ 1-5 ม.1 1/61
ใบงานที่ 1-5 ม.1 1/61Beerza Kub
 
สรุปผลการดำเนินงานภาคเรียนที่ 1
สรุปผลการดำเนินงานภาคเรียนที่ 1สรุปผลการดำเนินงานภาคเรียนที่ 1
สรุปผลการดำเนินงานภาคเรียนที่ 1Beerza Kub
 
หน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงาน
หน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงานหน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงาน
หน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงานBeerza Kub
 
ปฏิทินกลุ่มสาระ 61
ปฏิทินกลุ่มสาระ 61ปฏิทินกลุ่มสาระ 61
ปฏิทินกลุ่มสาระ 61Beerza Kub
 
Ebook ชิสุ
Ebook ชิสุEbook ชิสุ
Ebook ชิสุBeerza Kub
 
สื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพ
สื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพสื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพ
สื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพBeerza Kub
 
สื่อการสอน เรื่อง งานประดิษฐ์
สื่อการสอน เรื่อง งานประดิษฐ์สื่อการสอน เรื่อง งานประดิษฐ์
สื่อการสอน เรื่อง งานประดิษฐ์Beerza Kub
 
หน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกาย
หน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกายหน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกาย
หน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกายBeerza Kub
 
การซักผ้า (Washing)
การซักผ้า (Washing)การซักผ้า (Washing)
การซักผ้า (Washing)Beerza Kub
 
การตากผ้า (Clothes drying)
การตากผ้า (Clothes drying)การตากผ้า (Clothes drying)
การตากผ้า (Clothes drying)Beerza Kub
 
การจัดเก็บเสื้อผ้า
การจัดเก็บเสื้อผ้าการจัดเก็บเสื้อผ้า
การจัดเก็บเสื้อผ้าBeerza Kub
 
สื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้า
สื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้าสื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้า
สื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้าBeerza Kub
 
ครอบครัวอบอุ่น
ครอบครัวอบอุ่นครอบครัวอบอุ่น
ครอบครัวอบอุ่นBeerza Kub
 
มัลติมีเดีย
มัลติมีเดียมัลติมีเดีย
มัลติมีเดียBeerza Kub
 
อาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้น
อาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้นอาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้น
อาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้นBeerza Kub
 
รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)Beerza Kub
 
โครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้น
โครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้นโครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้น
โครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้นBeerza Kub
 
คู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้น
คู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้นคู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้น
คู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้นBeerza Kub
 
2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtmlBeerza Kub
 

More from Beerza Kub (20)

.Security Electric
.Security Electric.Security Electric
.Security Electric
 
ใบงานที่ 1-5 ม.1 1/61
ใบงานที่ 1-5 ม.1 1/61ใบงานที่ 1-5 ม.1 1/61
ใบงานที่ 1-5 ม.1 1/61
 
สรุปผลการดำเนินงานภาคเรียนที่ 1
สรุปผลการดำเนินงานภาคเรียนที่ 1สรุปผลการดำเนินงานภาคเรียนที่ 1
สรุปผลการดำเนินงานภาคเรียนที่ 1
 
หน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงาน
หน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงานหน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงาน
หน่วยการเรียนรู้ที่ 1 ทักษะและกระบวนการทำงาน
 
ปฏิทินกลุ่มสาระ 61
ปฏิทินกลุ่มสาระ 61ปฏิทินกลุ่มสาระ 61
ปฏิทินกลุ่มสาระ 61
 
Ebook ชิสุ
Ebook ชิสุEbook ชิสุ
Ebook ชิสุ
 
สื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพ
สื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพสื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพ
สื่อการสอน เรื่อง เครื่องดื่มเพื่อสุขภาพ
 
สื่อการสอน เรื่อง งานประดิษฐ์
สื่อการสอน เรื่อง งานประดิษฐ์สื่อการสอน เรื่อง งานประดิษฐ์
สื่อการสอน เรื่อง งานประดิษฐ์
 
หน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกาย
หน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกายหน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกาย
หน่วยที่ 2 เรื่อง เสื้อผ้าและการแต่งกาย
 
การซักผ้า (Washing)
การซักผ้า (Washing)การซักผ้า (Washing)
การซักผ้า (Washing)
 
การตากผ้า (Clothes drying)
การตากผ้า (Clothes drying)การตากผ้า (Clothes drying)
การตากผ้า (Clothes drying)
 
การจัดเก็บเสื้อผ้า
การจัดเก็บเสื้อผ้าการจัดเก็บเสื้อผ้า
การจัดเก็บเสื้อผ้า
 
สื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้า
สื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้าสื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้า
สื่อการสอน บทที่ 2 การดูแลรักษาเสื้อผ้า
 
ครอบครัวอบอุ่น
ครอบครัวอบอุ่นครอบครัวอบอุ่น
ครอบครัวอบอุ่น
 
มัลติมีเดีย
มัลติมีเดียมัลติมีเดีย
มัลติมีเดีย
 
อาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้น
อาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้นอาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้น
อาการเสียและวิธีแก้ปัญหาคอมพิวเตอร์เบื้องต้น
 
รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)รู้จักกับ Html(แก้ไข)
รู้จักกับ Html(แก้ไข)
 
โครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้น
โครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้นโครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้น
โครงสร้างคอมพิวเตอร์และหลักการทำงานเบื้องต้น
 
คู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้น
คู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้นคู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้น
คู่มือการใช้งาน Adobe Photoshop cs3 เบื้องต้น
 
2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml2.เริ่มต้นกับ xhtml และ xhtml
2.เริ่มต้นกับ xhtml และ xhtml
 

3.คำสั่งการจัดเอกสารบนหน้าเว็บ