Embedded Files
3. การจัดการตัวอักษร
3. การจัดการตัวอักษร
การกำหนดลักษณะและแบบของตัวอักษร
เป็นการกำหนดลักษณะตัวอักษรแบบเจาะจงไม่ว่าจะแสดงบนบราวเซอร์ใด ก็จะแสดงผลเหมือนกัน เช่น การกำหนดให้ตัวอักษรเป็นตัวหนา ตัวเอียง ตัวขีดฆ่า ตัวขีดเส้นใต้ แสดงแบบเลขยกกำลังในสูตรทางคณิตศาสตร์ หรือแสดงแบบตัวห้อยในสูตรทางวิทยาศาสตร์ เป็นต้น
1. คำสั่งสำหรับกำหนดอักษรตัวหนา (Bold) : <B> … </B>
<B>..........</B>
ใช้กำหนดข้อความที่อยู่ภายในคำสั่ง ให้แสดงผลด้วยตัวอักษรแบบตัวหนา (bold) มีจุดประสงค์เพื่อเน้นข้อความในประโยคนั้น
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>การกำหนดตัวหนา</TITLE>
</HEAD>
<BODY>
การกำหนดตัวหนาให้กัตัวอักษร<BR>
ตัวอักษรปรกติ COMPUTER <BR>
ตัวอักษรหนา <B>COMPUTER</B>
</BODY>
</HTML>
ผลลัพธ์
การกำหนดตัวหนาให้กัตัวอักษร
ตัวอักษรปรกติ COMPUTER
ตัวอักษรหนา COMPUTER
---------------------------------------------------------------
2. คำสั่งสำหรับกำหนดอักษรตัวเอน (Italic) : <I> … </I>
<I>..........</I>
ใช้กำหนดข้อความที่อยู่ภายในคำสั่งให้แสดงผลด้วยตัวอักษรแบบเอน (Italic) มีจุดประสงค์เพื่อเน้นข้อความในประโยคนั้น
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>กำหนดอักษรตัวเอน </TITLE>
</HEAD>
<BODY>
การกำหนดอักษรตัวเอน <BR>
ตัวอักษรปรกติ COMPUTER <BR>
ตัวอักษรตัวเอน <I>COMPUTER</I>
</BODY>
</HTML>
ผลลัพธ์
การกำหนดอักษรตัวเอน
ตัวอักษรปรกติ COMPUTER
ตัวอักษรตัวเอน COMPUTER
---------------------------------------------------------------
3. คำสั่งสำหรับกำหนดอักษรขีดเส้นใต้ (Underline) : <U> … </U>
<U>..........</U>
ใช้แสดงข้อความแบบขีดเส้นใต้ (underline) ทั้งนี้เพื่อเน้นข้อความในประโยคนั้น
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>การกำหนดการขีดเส้นใต้</TITLE>
</HEAD>
<BODY>
การกำหนดการขีดเส้นใต้ <BR>
ตัวอักษรปกติ COMPUTER<BR>
ตัวอักษรขีดเส้นใต้ <U> COMPUTER </U>
</BODY>
</HTML>
ผลลัพธ์
การกำหนดการขีดเส้นใต้
ตัวอักษรปกติ COMPUTER
ตัวอักษรขีดเส้นใต้ COMPUTER
---------------------------------------------------------------
4. คำสั่งสำหรับกำหนดตัวอักษรตัวขีดฆ่า : <S>..........</S>
<S>..........</S>
ใช้แสดงข้อความแบบขีดฆ่าตัวอักษร ทั้งนี้เพื่อเน้นข้อความเปรียบเทียบหรือไม่ต้องการในประโยคนั้น
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE> การกำหนดอักษรขีดเส้นใต้ </TITLE>
</HEAD>
<BODY>
กำหนดอักษรขีดเส้นใต้ <BR>
<S>Microsoft Windows 7</S>
</BODY>
</HTML>
ผลลัพธ์
กำหนดอักษรขีดเส้นใต้
Microsoft Windows 7
---------------------------------------------------------------
5. คำสั่งสำหรับกำหนดอักษรตัวกระพริบ (Blink) : <BLINK> … </BLINK>
<BLINK>..........</BLINK>
ใช้กำหนดแสดงข้อความแบบกระพริบ จะมีลักษณะการแสดงผลเป็นแบบติด - ดับ สลับกันไป
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>กำหนดอักษรตัวกระพริบ </TITLE>
</HEAD>
<BODY>
การกำหนดอักษรตัวกระพริบ <BR>
<Blink>COMPUTER</Blink>
</BODY>
</HTML>
---------------------------------------------------------------
6. คำสั่งสำหรับกำหนดอักษรให้เคลื่อนที่ (MARQUEE)
<MARQUEE> .......... </MARQUEE>
ใช้สำหรับแสดงข้อความแบบเคลื่อนที่ไปยังทิศทางที่เราต้องการ มีรูปแบบการใช้ดังนี้
<marquee scrolldelay="ความเร็ว" direction="ทิศทางวิ่ง">ข้อความ</marquee>
- scrolldelay ให้แทนค่าด้วยความเร็วเป็น ตัวเลข ส่วน direction ใส่ได้เฉพาะ Up,Down,Left และ Right
ตัวอย่างการใช้คำสั่ง
<html>
<head>
<title>marque</title>
</head>
<body>
<center>
<marquee scrolldelay="100" direction="Right">WEBTHAIDD</marquee>
<marquee scrolldelay="100" direction="Left">WEBTHAIDD</marquee>
<marquee scrolldelay="100" direction="Up">WEBTHAIDD</marquee>
<marquee scrolldelay="100" direction="Down">WEBTHAIDD</marquee>
</body>
</html>
---------------------------------------------------------------
7. คำสั่งสำหรับกำหนดแบบอักษรตัวห้อยและแบบอักษรตัวยก : <SUP> … </SUP> และ <SUB> …</SUB>
ข้อความแบบฟังก์ชั่นทางคณิตศาสตร์ <SUP>.....</SUP>
ข้อความแบบสูตรทางวิทยาศาสตร์ <SUB>.....</SUB>
การกำหนดแบบอักษรตัวห้อยและแบบอักษรตัวยกในเว็บเพจนั้น เราสามารถกำหนดขนาดของตัวอักษรได้ดังนี้
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>แบบอักษรตัวห้อยและแบบอักษรตัวยก </TITLE>
</HEAD>
<BODY >
Computer<SUP>2</SUP> <P>
H<SUB>2</SUB>O<P>
</BODY>
</HTML>
ผลลัพธ์
Computer2
H2O
---------------------------------------------------------------
8. คำสั่งสำหรับกำหนดรูปแบบตัวอักษร : <FONT FACE = "......."> … </FONT>
<FONT FACE="รูปแบบตัวอักษรที่ต้องการ" >..........</FONT>
การกำหนดรูปแบบของตัวอักษรในเว็บเพจที่เราต้องการให้แสดงออกบนเว็บ
ตัวอย่างการใช้คำสั่ง
<html>
<head>
<title>การกำหนดขนาดตัวอักษร</title>
</head>
<body>
<font face="Cordiaupc">HTML</font><br>
<font face="Ms sans serif">HTML</font><br>
<font face="AngsanaUPC">HTML</font><br>
<font face="arial">HTML</font><br>
</body>
</html>
ผลลัพธ์
HTML
HTML
HTML
HTML
---------------------------------------------------------------
9. คำสั่งสำหรับกำหนดขนาดตัวอักษร : <FONT SIZE = ขนาด> … </FONT>
<FONT SIZE="ค่ากำหนดขนาดของตัวอักษร">..........</FONT>
การกำหนดขนาดของตัวอักษรในเว็บเพจนั้น เราสามารถกำหนดขนาดของตัวอักษรได้ดังนี้ คือ
· กำหนดเป็นตัวเลขซึ่งจะมีค่า 1 - 7 โดยค่ามาตรฐานจะมีค่าจะอยู่ที่ 3 ค่าตัวเลขที่เป็น 1 และ 2 นั้นจะเป็นการย่อขนาดของตัวอักษร และค่าตัวเลข 4 ถึง 7 นั้นจะเป็นการขยายขนาดของตัวอักษร
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>FONT SIZE </TITLE>
</HEAD>
<BODY >
<FONT SIZE="1">Computer</Font>
<FONT SIZE="2">Computer</Font>
<FONT SIZE="3">Computer</Font>
<FONT SIZE="4">Computer</Font>
<FONT SIZE="5">Computer</Font>
<FONT SIZE="6">Computer</Font>
<FONT SIZE="7">Computer</Font>
</BODY>
</HTML>
ผลลัพธ์
Computer Computer Computer Computer Computer ComputerComputer
---------------------------------------------------------------
10. คำสั่งสำหรับกำหนดสีตัวอักษร : <FONT COLOR = รหัสสี> … </FONT>
<FONT COLOR="#RGB" หรือ กำหนดชื่อสีที่ต้องการ">..........</FONT>
ใช้การกำหนดให้ตัวอักษรหรือข้อความมีสีอื่นต่างจากสีตัวอักษรทั่วไป หรือต้องการเน้นสีสันเพื่อเพิ่มจุดเด่น ทำให้แปลกแตกต่างไป การระบุค่าสี สามารถใช้ได้ทั้งระบุชื่อสี หรือค่าสีในระบบเลขฐาน 16
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>FONT COLOR </TITLE>
</HEAD>
<BODY >
<FONT COLOR="Red">Computer</FONT>
<FONT COLOR="Green">Computer</FONT>
<FONT COLOR="Black">Computer</FONT>
</BODY>
</HTML>
ผลลัพธ์
Computer Computer Computer
---------------------------------------------------------------
11. คำสั่งสำหรับกำหนดสีพื้นหลังของเอกสาร : <BODY BGCOLOR = รหัสสี> … </BODY>
การกำหนดสีพื้นหลังและการกำหนดสีของตัวอักษรนั้น จะทำการเขียนในส่วนของคำสั่ง <BODY> โดยเราจะใช้แอตทริบิวต์มาเป็นตัวกำหนด
การกำหนดสีของพื้นหลัง - การกำหนดสีพื้นหลังนั้น เราสามารถมีรูปแบบการกำหนดสีพื้นหลังได้อยู่ 2 รูปแบบ
· ระบุชื่อของสีที่ต้องการ อาทิเช่น red, green, yellow, blue เป็นต้น
· ระบุรหัสของสีที่ต้องการ อาทิเช่น #FFFF00 , #0000CC , #FF66FF เป็นต้น
ตัวอย่างการใช้คำสั่ง
<HTML>
<HEAD>
<TITLE>การกำหนดสีพื้นหลังโดยการกำหนดสี</TITLE>
</HEAD>
<BODY BGCOLOR="#00FF00">
การกำหนดสีพื้นหลังโดยการกำหนดสี
</BODY>
</HTML>
ผลลัพธ์
---------------------------------------------------------------
12. คำสั่งสำหรับกำหนดสีให้กับตัวอักษรทั้งเอกสาร : <BODY TEXT = รหัสสี> … </BODY>
<BODY TEXT="#RGB" หรือ กำหนดชื่อสีที่ต้องการ">...........</BODY>
เราสามารถมีรูปแบบการกำหนดสีได้อยู่ 2 รูปแบบ
· ระบุชื่อของสีที่ต้องการ อาทิเช่น red, green, yellow, blue เป็นต้น
· ระบุรหัสของสีที่ต้องการ อาทิเช่น #FFFF00 , #0000CC , #FF66FF เป็นต้น
<HTML>
<HEAD>
<TITLE> การกำหนดสีตัวอักษรทั้งหมด </TITLE>
</HEAD>
<BODY text ="blue" >
การกำหนดสีตัวอักษรทั้งหมดของเว็บเพจ
</BODY>
</HTML>
ผลลัพธ์
การกำหนดสีตัวอักษรทั้งหมดของเว็บเพจ
---------------------------------------------------------------
Google Sites
Report abuse