เรียนรู้ภาษา html
เมื่อ จันทร์, 04/05/2009 - 09:29 | แก้ไขล่าสุด จันทร์, 04/05/2009 - 14:20| โดย 
onsiri
3. การกําหนดรูปแบบตัวอักษร
3.1 Physical Style
รูปแบบคําสั่ง รูปแบบตัวอักษร
<B>…</B> Bold Text
<I>…</I> Italic Text
<U>…</U> Underline text
3.2 Logical Style
รูปแบบคําสั่ง รูปแบบตัวอักษร
<Em>,</Em> Italic Text
<Strong>,</Strong> Bold Text
<TT>,<TT> Mono spaced text
เปนการกําหนดชนิดของตัวอักษรตามที่ตองการลงไปตามที่เราตองการลงไป เชนถาตองการตัวอักษรหนาก็
ทําได เชน <Strong > this is strong emphasis <bold> text </strong> จะได ขอความ this is strong emphasis text เปน
ตัวหนา สําหรับการกําหนดรูปแบบอื่นก็ทําเหมือนกัน
**ในที่นี้ขอแนะนําใหใชแบบ Physical เพราะงายตอการจํา ยกเวนบราวเซอรบางตังจึงใช แบบ Logical
Examp11.html
<HTML>
<HEAD>
<TITLE> ทดสอบการใชตัวอักษรแบบตางๆ</TITLE>
</HEAD>
<BODY>
<H1> แสดงลักษณะของตัวอักษรแบบตางๆ</H1><BR><basefont size
="4"><BR>
<b> This is Bold text </b><BR>
<i> This is Italic text </i><BR>
<u> This is underline text </u><BR>
<I><b><u>This is Italic and Bold and Underline Text </u></b></i>
</BODY>
</HTML>
140
ผลการรัน Examp11.html
แสดงการใชตัวอักษรแบบตางๆ
Examp12.html
<HTML>
<HEAD>
<TITLE> การใชรูปแบบตัวอักษรแบบ Logical </TITLE>
</HEAD>
<BODY>
<H1> Welcome Home !! </H1>
<em> This is Emphasis <Italic> text .</em><BR>
<strong> This is Strong emphasis <bold>text </strong><BR>
<tt> This is Teletype <Monospaced> Text </tt><BR>
<strong><em>This is strong and Emphasis <Bold and Italic> Text</em</strong>
</BODY>
</HTML>
141
ผลการรัน Examp12.html
แสดงการใชรูปแบบตัวอักษรแบบ Logical Style
4. Preformatted Text
รูปแบบคําสั่ง
<PRE>…</PRE>
เปนการกําหนดรูปแบบการแสดงผลตามที่เราตองการโดยไมจําเปนตองขึ้นอยูกับคําสั่งอื่นๆ การใชคําสั่ง
<PRE> นี้มีการใช 2 รูปแบบคือ
1. ใชในการสรางเอกสารสวนตัวตามรูปแบบของตัวเอง โดยไมขึ้นอยูกับคําสั่งอื่นๆ คือจะสามารถจัด
หนาจัดรูปแบบไดตามตองการ
2. ใชในการสรางตารางอยางงายที่ไมตองการรายละเอียดเทาไรนัก
142
Examp13.html
<HTML>
<HEAD>
<TITTLE> Creat My Layout 1 </TITLE>
</HEAD>
<BODY>
<P>แสดงการใชคําสั่ง <PRE> ในHome page </P>
<HR>
<PRE>
"Some time I do
But some time do I"
" I can every work in only time
but every time I can't do only work"
</PRE>
</BODY>
</HTML>
ผลการรัน Examp13.html
แสดงการใชคําสั่ง <PRE> ในการจัดรูปแบบ
ตามที่ตองการ
*** ในคําสั่ง <PRE> จะไมสามารถใช
ตัวภาษาไทยไดเพราะตัวอักษรที่จะใชได
ตองมีขนาดความกวางเทากัน
การใชคําสั่ง <PRE> ในการสรางตารางอยางงาย
143
Examp14.html
<HTML>
<HEAD>
<TITLE> การใชคําสั่ง Pre ในการสรางตารางอยางงาย </TITLE>
</HEAD>
<BODY>
<H1><CENTER> รายชื่อผูบริหารในบริษัท Kmit'l company</CENTER></H1>
<HR size ="5" width = "80%" align = "center" noshade>
<PRE>
<H2>Name Position Salary(฿)</H2>
Opas Akkarajun Product manager 155,000
Mongkon Tongbun Control Engineering 150,500
Sunti Sirisaypirun Marketing manager 149,000
Vorapod Rugsksuk Personal manager 148,000
Tawapong Pukdeepreeda Engineering 120,000
Chutchai Supradis Engineering 120,000
</PRE>
</BODY>
</HTML>
ผลการรัน Examp14.html
แสดงการใชคําสั่ง PRE ในการ
สรางตารางอยางงายจะเห็นไดวา
การจัดรูปแบบจะไมคอยสวยงาม
ตามที่ตองการนัก
144
อ่าน 12743 ครั้ง | 
Tags: 
ช่วยด้วยครับ
นักเรียนที่สร้างบล็อก กรุณาอย่า
คัดลอกข้อมูลจากเว็บอื่นทั้งหมด
ควรนำมาจากหลายๆ เว็บ แล้ววิเคราะห์ สังเคราะห์ และเขียนขึ้นใหม่
หากคัดลอกทั้งหมด จะถูกดำเนินคดี
ตามกฎหมายจากเจ้าของลิขสิทธิ์
มีโทษทั้งจำคุกและปรับในอัตราสูง
ช่วยกันนะครับ
ไทยกู๊ดวิวจะได้อยู่นานๆ
ไม่ถูกปิดเสียก่อน
ขอขอบคุณในความร่วมมือครับ
ด่วน...... ขณะนี้
พระราชบัญญัติลิขสิทธิ์ (ฉบับที่ 2) พ.ศ. 2558
มีผลบังคับใช้แล้ว
ขอให้นักเรียนและคุณครูที่ใช้งาน
เว็บ thaigoodview ในการส่งการบ้าน
ระมัดระวังการละเมิดลิขสิทธิ์ด้วย
อ่านรายละเอียดที่นี่ครับ
ได้ความรู้ดีครับ®