ให้เรตสมาชิก: 2 / 5

ดาวใช้งานดาวใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งานดาวไม่ได้ใช้งาน
 

บทที่ 10 HTML CSS

HTML CSS คือ การจัดรูปแบบด้วย CSS

CSS ย่อมาจาก Cascading Style Sheets ซึ่งใช้ในการกำหนดรูปแบบต่าง ๆ ให้กับแท็ก html ต่าง ๆ

1.การใส่สีพื้นหลัง และสีตัวอักษร

   - การใส่สีพื้นหลังให้หน้าเว็บเพจ จะใส่ในแท็ก body

<body style="background-color:=ชื่อสีเป็นภาษาอังกฤษ หรืออาจใส่เครื่องหมายสี่เหลี่ยมตามด้วยด้วยตัวเลขบอกค่าสีก็ได้ ;">

 

 - การใส่สีพื้นหลังให้ตัวอักษร ใส่ได้ทั้งในส่วน head คือ Tag <p> และส่วน paragraph คือ Tag <p>       

<p style="background-color:ชื่อสีเป็นภาษาอังกฤษ หรืออาจใส่เครื่องหมายสี่เหลี่ยมตามด้วยด้วยตัวเลขบอกค่าสีก็ได้;">ใส่ข้อความที่ต้องการตรงนี้</p>


   - การใส่สีให้ตัวอักษร ใส่ได้ทั้งในส่วน head คือ Tag <p> และส่วน paragraph คือ Tag <p>     

<p style="color:ชื่อสีเป็นภาษาอังกฤษ หรืออาจใส่เครื่องหมายสี่เหลี่ยมตามด้วยด้วยตัวเลขบอกค่าสีก็ได้;">ใส่ข้อความที่ต้องการตรงนี้</p>

ตัวอย่าง

<html>

<body style="background-color:yellow;">
<h2 style="background-color:red;">This is a heading</h2>
<p style="background-color:green;">This is a paragraph.</p>
<p style="color: blue;">This text is in Times and blue</p>

</body>
</html>

ผลลัพธ์ที่ได้คือ

2.การเลือกแบบตัวอักษร และขนาดตัวอักษร

   - การเลือกรูปแบบตัวอักษร สามารถใส่ได้ทั้งในส่วน head คือ Tag <p> และส่วน paragraph คือ Tag <p>   

<p style="font-family:ชื่อฟอนต์;">ใส่ข้อความที่ต้องการตรงนี้</p>


   - การใส่ขนาดตัวอักษร สามารถใส่ได้ทั้งในส่วน head คือ Tag <p> และส่วน paragraph คือ Tag <p> 

 <p style="font-size:ใส่ตัวเลขบอกขนาด;">ใส่ข้อความที่ต้องการตรงนี้</p>


   - หากต้องการใส่ทั้ง แบบตัวอักษร ขนาด และสี ทำได้ดังนี้  

 <p style="font-family:ชื่อตัวอักษร;color:ชื่อสี;font-size:เลขบอกขนาดตัวอักษร;">ใส่ข้อความที่ต้องการ</p>

ตัวอย่าง

<html>
<body>
<h1 style="font-family:Tahoma;">กำหนดแท็ก h1 เป็นตัวอักษร Tahoma</h1>
<p style="font-family:arial;color:red;font-size:20px;">ย่อหน้านี้ใช้ตัวอักษร Arial ขนาด 20 px และตัวอักษรสีแดง</p>
</body>
</html>

ผลลัพธ์ที่ได้คือ

3.การจัดวางแนวตัวอักษร
  การจัดวางเเนวตัวอักษร เช่น ซ้าย ,ขวา ,กลาง จัดได้ดังนี้

   style="text-align:กำหนด left หรือ right หรือ center

  ตัวอย่าง

<html>
<body>

<h1 style="text-align:right;">กำหนดให้ข้อความนี้อยู่ด้านขวามือ</h1>
<p>ย่อหน้านี้จัดวางแบบปกติ</p>

</body>
</html>

ผลลัพธ์ที่ได้คือ

กระทู้ล่าสุดจากเว็บบอร์ด
หัวข้อกระทู้
ตอบ
เปิดดู
ล่าสุด
มีปัญหาเรื่อง session ใครรู้ช่วยตอบหบ่อยครับ
โดย Anonymous พ 01 มี.ค. 2006 4:44 am บอร์ด Programming - PHP
2
3570
ศ 12 พฤษภาคม 2006 4:22 am โดย joshino
โค้ด php mysql
โดย Anonymous ศ 24 ก.พ. 2006 8:55 pm บอร์ด Programming - PHP
9
3992
อ 12 ธ.ค. 2006 2:50 am โดย nambuai
โค้ด php
โดย Anonymous ศ 24 ก.พ. 2006 8:27 pm บอร์ด Programming - PHP
5
4768
อ 12 ธ.ค. 2006 2:59 am โดย nambuai
อยากได้ code บ้าง
โดย Anonymous พฤ 23 ก.พ. 2006 9:02 am บอร์ด Programming - PHP
1
2420
พฤ 23 ก.พ. 2006 9:04 am โดย บุคคลทั่วไป
อยากรู้วิธี อัพโหลด เว็บสู่ sever โดยใช้ browser
โดย Anonymous จ 20 ก.พ. 2006 5:27 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
5677
จ 13 มิ.ย. 2011 10:05 am โดย suukmiie
ดูให้หน่อยซิค่าว่าผิดตรงไหน ทำไมไม่griup ตรง $gp ให้ค่ะ
โดย Anonymous อ 14 ก.พ. 2006 6:55 pm บอร์ด Programming - PHP
1
2261
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
madona
โดย Anonymous อ 12 ก.พ. 2006 12:09 pm บอร์ด Programming - PHP
1
2359
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
อยากได้โค๊ตค่ะ
โดย Anonymous อ 07 ก.พ. 2006 11:20 am บอร์ด Programming - PHP
0
1985
อ 07 ก.พ. 2006 11:20 am โดย บุคคลทั่วไป
โค้ดแบ่งหน้า php กับ SQL 2000 ครับ
โดย Anonymous พฤ 02 ก.พ. 2006 8:38 am บอร์ด Programming - PHP
1
2866
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
อยยากรู้มากๆๆpaypal
โดย Anonymous ส 28 ม.ค. 2006 4:12 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
4
3878
ส 16 ก.ค. 2011 7:37 am โดย kwanbenze
ปัญหามากมายค่ะ
โดย Anonymous อ 17 ม.ค. 2006 10:37 pm บอร์ด Programming - PHP
1
2278
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
วิธีเพิ่มความสามารถของ php
โดย จ 16 ม.ค. 2006 11:57 am บอร์ด Programming - PHP
0
2106
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
MSN7.5
โดย Anonymous ส 14 ม.ค. 2006 1:17 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
4889
จ 11 ก.ย. 2006 8:53 pm โดย บุคคลทั่วไป
ต่อบลูทูธกับโน๊ตบุคทำยังไง
โดย Anonymous พ 11 ม.ค. 2006 3:13 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
3380
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
ใช้ไทยเมลได้ไหม?
โดย Anonymous อ 10 ม.ค. 2006 1:23 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
0
2882
อ 10 ม.ค. 2006 1:23 pm โดย บุคคลทั่วไป
รับสอน สอนเขียนเว็บ เขียนโปรแกรม สอนทำเว็บ รับจ้างทำเว็บ
โดย อ 10 ม.ค. 2006 12:39 pm บอร์ด MindPHP News / Feedback
51
86695
พฤ 10 มี.ค. 2011 10:19 pm โดย samurai111
ขอคำปรึกษาระบบ lan หน่อยนะคับ
โดย Anonymous พฤ 05 ม.ค. 2006 1:02 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
3
3776
ศ 06 ม.ค. 2006 1:27 am โดย บุคคลทั่วไป
หาเลข PIN
โดย Anonymous พฤ 29 ธ.ค. 2005 12:08 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
2347
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
หา Account Number ไม่พบ
โดย sppk พฤ 08 ธ.ค. 2005 1:04 am บอร์ด ถาม - ตอบ คอมพิวเตอร์
1
2539
พฤ 01 ม.ค. 1970 7:00 am โดย 4404
ขอแนะนำเกียวกับโปรแกรมเล่นKARAOKEที่ใช้Visua Basicเขียนหน่อย
โดย Anonymous พ 30 พ.ย. 2005 4:31 pm บอร์ด ถาม - ตอบ คอมพิวเตอร์
2
3100
จ 12 ธ.ค. 2005 12:35 pm โดย บุคคลทั่วไป