หน้าแรก
 คำแนะนำการใช้บทเรียน
 ข้อมูลรายวิชา
 Notepad
 แบบทดสอบก่อนเรียน
 แบบทดสอบหลังเรียน
 1 รู้จัก HTML5
 2 โครงสร้างพื้นฐาน HTML5
 3 รู้จัก CSS3
   จุดประสงค์การเรียนรู้
   เกี่ยวกับ CSS3
   การจัดรูปแบบข้อความ
   รูปภาพ
   มัลติมีเดีย
   ลองทำดู รู้ปฏิบัติ
   แบบฝึกหัดที่ 3
 4 การเชื่อมโยง
 5 การสร้างตาราง
 

 

 

 

 

 

 

 

 

ข้อความถือเป็นองค์ประกอบพื้นฐานของเว็บเพจ ทั้งนี้การที่เว็บไซต์จะดูน่าสนใจเพียงใดนั้น
ข้อความถือเป็นส่วนสำคัญ นอกจากจะเป็นสวนเนื้อหาสาระแล้ว การจัดรูปแบบข้อความให้ดูสวยงามและเหมาะสม
เป็นปัจจัยหนึ่งที่ช่วยส่งเสริมให้เว็บไซต์มีความน่าสนใจเพิ่มมากขึ้น
 
       พร็อปเพอร์ตี้ ( Property ) ในการจัดรูปแบบข้อความ

Font-family

 กำหนดชนิดของฟอนต์ อาจจะกำหนดเพียงชนิดเดียวหรือหลายชนิดก็ได้
 โดยค่าที่กำหนดได้ คือ
 -ชนิดฟอนต์
 -ชนิดฟอนต์ 1, ชนิดฟอนต์ 2, ชนิดฟอนต์ 3,...

Font-size

 กำหนดขนาดของฟอนต์ โดยทั่วไปนิยมกำหนดขนาดเป็นตัวเลขตามด้วยหน่วย
 (เช่น px) หรือ กำหนดเป็นค่าคงที่ โดยค่าที่กำหนดได้ คือ
 -<ขนาด><หน่วย>
 - xx-small, x-small, small, medium, large, x-large, xx-large

Font-weight

 การกำหนดขนาดความหนาหรือน้ำหนักของฟอนต์ โดยค่าที่กำหนดได้ คือ
 -lighter (ตัวบาง)
 -bold (ตัวหนาเทียบเท่ากับ <b>
 -bolder (ตัวหนากว่า)
 -100, 200, 300, …, 800, 900 (ไม่ต้องระบุหน่วย)

Font-style

 การกำหนดฟอนต์แบบตัวเอียง โดยค่าที่กำหนดได้ คือ
 -italic
 -oblique (เอียง 45 องศา)

Color

 กำหนดสีของข้อความโดยค่าที่กำหนดได้ คือ (รายละเอียดในบทที่ 3 เกี่ยวกับ CSS3 )
 -ชื่อสี
 -rgb(red, green, blue)
 -#hex

Text-shadow

 กำหนดเงาให้กับข้อความ โดยค่าที่กำหนดได้ คือ
 -<ระยะเหลื่อมในแนวนอน> <ระยะเหลื่อมในแนวตั้ง> <สี>
 -<ระยะเหลื่อมในแนวนอน> <ระยะเหลื่อมในแนวตั้ง> <ระยะการเบลอของเงา> <สี>

Text-align

 กำหนดการจัดแนวข้อความในแนวนอนว่าจะให้ชิดด้านใด โดยค่าที่กำหนดได้ คือ
 left , right ,  center , justify

Text-decoration

 กำหนดลักษณะการตกแต่งข้อความ โดยค่าที่กำหนดได้ คือ
 -underline (การขีดเส้นใต้)
 -overline (ขีดเส้นใต้เหนือข้อความ)
 -line-through (ขีดเส้นทับข้อความ เหมือนกับ <del>

Text-indent

 กำหนดระยะเยื้องของย่อหน้าจากแนวขอบด้านซ้ายของอิลิเมนต์
 ซึ่งมีผลเฉพาะบรรทัดแรกของย่อหน้าเท่านั้น
 <ค่าระยะ><หน่วย>

 
     ศึกษารายละเอียดแต่ละพร็อปเพอร์ตี้ ( Property ) ในหน้าต่อไป