งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

งานนำเสนอกำลังจะดาวน์โหลด โปรดรอ

หน่วยที่ 12 หน่วยที่ 12 Style Sheet and Layers. หัวข้อเนื้อหา ความหมายของสไตล์ชีท (Style Sheet) คุณสมบัติสมบัติต่าง ๆ ของสไตล์ซีท คุณสมบัติที่เกี่ยวกับตัวอักษร.

งานนำเสนอที่คล้ายกัน


งานนำเสนอเรื่อง: "หน่วยที่ 12 หน่วยที่ 12 Style Sheet and Layers. หัวข้อเนื้อหา ความหมายของสไตล์ชีท (Style Sheet) คุณสมบัติสมบัติต่าง ๆ ของสไตล์ซีท คุณสมบัติที่เกี่ยวกับตัวอักษร."— ใบสำเนางานนำเสนอ:

1 หน่วยที่ 12 หน่วยที่ 12 Style Sheet and Layers

2 หัวข้อเนื้อหา ความหมายของสไตล์ชีท (Style Sheet) คุณสมบัติสมบัติต่าง ๆ ของสไตล์ซีท คุณสมบัติที่เกี่ยวกับตัวอักษร คุณสมบัติที่เกี่ยวข้องกับสีและพื้นหลัง คุณสมบัติที่เกี่ยวข้องกับข้อความ คุณสมบัติที่เกี่ยวข้องกับกรอบ การกำหนดสไตล์ชีท

3 หัวข้อเนื้อหา ( ต่อ ) การกำหนดแบบสไตล์ย่อยด้วย Class และ ID การใช้งาน SPAN ความหมายของเลเยอร์ การกำหนดตำแหน่งของเลเยอร์ การกำหนดขนาดของเลเยอร์ การกำหนดสีพื้นหลังของเลเยอร์ การกำหนดเลเยอร์ซ้อนทับกัน

4 ความหมายของสไตล์ซีท (Style Sheet) สไตล์ซีท (Style Sheet) คือ การกำหนด รูปแบบการแสดงผลของเว็บเพจ เพื่อใช้ ในการควบคุม การแสดงผลเกี่ยวกับรูปแบบ และชนิด ตัวอักษร รูปภาพ การกำหนดสีและเส้น รวม ไปถึงการจัดวางตัวอักษรแบบต่างๆ เพื่อให้ เกิดความถูกต้องและแม่นยำ และยัง สามารถลดความยุ่งยากในการจัดทำเว็บ เพจ เพราะสามารถทำการกำหนดรูปแบบที่ ต้องการไว้ในรูปแบบของสไตล์ซีท จากนั้น ก็นำไปใช้กับข้อความส่วนใดส่วนหนึ่งของ เอกสาร HTML หรือนำไปใช้กับเอกสาร ทั้งหมดตามความต้องการได้

5 คุณสมบัติต่าง ๆ ของสไตล์ ซีท การกำหนดคุณสมบัติต่าง ๆ ของสไตล์ซีท สามารถคุณบัติที่เกี่ยวข้องเป็นกลุ่ม ๆ ได้ดังนี้ 1. คุณสมบัติที่เกี่ยวข้องกับตัวอักษร 2. คุณสมบัติที่เกี่ยวข้องกับสีและพื้น ด้านหลัง 3. คุณสมบัติที่เกี่ยวข้องกับข้อความ 4. คุณสมบัติที่เกี่ยวข้องกับกรอบ 5. คุณสมบัติที่เกี่ยวข้องกับหน่วยที่ใช้ในการ วัด

6 1. คุณสมบัติที่เกี่ยวข้องกับ ตัวอักษร การกำหนดคุณสมบัติที่เกี่ยวข้องกับ ตัวอักษรประกอบด้วย 1. การกำหนดแบบตัวอักษร 2. การกำหนดขนาดตัวอักษร 3. การกำหนดความสูงของบรรทัด 4. การกำหนดความหนาของตัวอักษร 5. การกำหนดลักษณะของตัวอักษร 6. การกำหนดลักษณะของแบบตัวอักษร ทั้งหมด

7 2. คุณสมบัติที่เกี่ยวข้องกับสีและ พื้นหลัง เป็นการกำหนดสีตัวอักษรและสีพื้นหลัง มี 2 คำสั่ง ประกอบด้วย 1. การกำหนดสีให้กับตัวอักษร 2. การกำหนดสีของพื้นหลัง

8 3. คุณสมบัติที่เกี่ยวข้องกับ ข้อความ เป็นการกำหนดคุณสมบัติที่เกี่ยวข้องกับ ข้อความ ประกอบด้วย 1. การกำหนดช่องไฟระหว่างคำ 2. การกำหนดช่องไฟระหว่างตัวอักษร 3. การกำหนดการขีดเส้นของข้อความ 4. การกำหนดย่อหน้าของข้อความ 5. กำหนดขนาดความหนาของข้อความ 6. การจัดวางตัวอักษร 7. การกำหนดระยะขอบ

9 4. คุณสมบัติที่เกี่ยวข้องกับกรอบ การกำหนดคุณสมบัติที่เกี่ยวข้องกับกรอบ ประกอบด้วย 1. การกำหนดระยะห่างของกรอบ 2. การกำหนดระยะห่างของกรอบและ ข้อความ 3. การกำหนดความกว้างของเส้นกรอบ 4. การกำหนดสีของเส้นกรอบ 5. การกำหนดรูปแบบของเส้นกรอบ

10 การกำหนดสไตล์ซีท การกำหนดสไตล์ซีท มี 3 ลักษณะคือ 1. กำหนดแบบสไตล์ร่วม (Embedded Style Sheet) 2. กำหนดแบบสไตล์เฉพาะที่ (Inline Style Sheet) 3. กำหนดให้ใช้สไตล์ซีทจากภายนอก (Linked Style Sheet)

11 Import Style Import Style Sheet มีลักษณะการ ทำงานที่เหมือนกับ Link Style Sheet คือ ต้องสร้างไฟล์ที่กำหนดสไตล์ชีทไว้ในไฟล์ ที่มีนามสกุล.CSS แล้วเชื่อมโยงมาใช้งาน ในไฟล์เอกสาร HTML รูปแบบคำสั่งของ Import Style Sheet มีดังนี้

12 การกำหนดแบบสไตล์ย่อยด้วย Class และ ID CLASS และ ID ซึ่งเป็นหลักการของ Object Oriented ซึ่งช่วยให้การกำหนด สไตล์มีความอ่อนตัวในการใช้งานมากขึ้น เพิ่มประสิทธิภาพในการกำหนดสไตล์ให้กับ แท็กเดียวกัน สามารถแสดงผลได้หลาย รูปแบบ หรือกำหนดรูปแบบแล้วสามารถใช้ งานได้หลาย ๆ แท็ก

13 การใช้งาน การใช้งาน คือ คำสั่งที่สร้างขึ้นเพื่อกำหนด คุณสมบัติของสไตล์ซีท ในกรณีที่ต้องการ เปลี่ยนแปลงรูปแบบสไตล์ในส่วนใดส่วน หนึ่งของเอกสาร แต่ไม่ต้องการ เปลี่ยนแปลงทั้งเอกสาร และยังกำหนดให้ ใช้ร่วมกับสไตล์ย่อยแบบ CLASS และ ID ได้อีกด้วย 4

14 เลเยอร์ (Layer) เลเยอร์ (Layer) เป็นคำสั่งที่ช่วยในการจัด กลุ่มของข้อมูล โดยการแยกข้อมูลออกเป็น ชั้นๆแต่ละชั้นเป็นอิสระต่อกัน ทำให้ สามารถแก้ไขข้อมูลในชั้นที่ต้องการได้ โดยที่ไม่กระทบกระเทือนต่อข้อมูลใน

15 การกำหนดให้เลเยอร์ซ้อนทับกัน ถ้าต้องการกำหนดให้เลเยอร์ 2 เลเยอร์ขึ้น ไปมีการซ้อนทับกัน จะต้องมีการกำหนด ลำดับของเลเยอร์ที่จะซ้อนกันเสียก่อน โดยสามารถกำหนดได้ 2 รูปแบบ คือ 1. กำหนดให้วางซ้อนทับกันโดยดูจาก ตัวเลขของลำดับ 2. กำหนดให้วางซ้อนทับกันโดยการกำหนด ชื่อ

16 แบบฝึกหัด หน่วยที่ 12 จงตอบคำถามต่อไปนี้ให้สมบูรณ์ จงอธิบายความหมายของ STYLE SHEET ว่ามี ความหมายว่าอย่างไร การกำหนด STYLE SHEET มีกี่ลักษณะ อะไรบ้าง การกำหนดสไตล์ซีทมีกีแบบ อะไรบ้าง จงอธิบาย คำว่า Linked Style Sheet จงอธิบายคำว่า Inline Style Sheet จงอธิบายความหมายของคำสั่ง เลเยอร์ การกำหนดการวางซ้อนทับของเลเยอร์มีกี่ รูปแบบ อะไรบ้าง จงเขียนรูปแบบการกำหนดเลเยอร์ ด้วยวิธีการ กำหนดชื่อ


ดาวน์โหลด ppt หน่วยที่ 12 หน่วยที่ 12 Style Sheet and Layers. หัวข้อเนื้อหา ความหมายของสไตล์ชีท (Style Sheet) คุณสมบัติสมบัติต่าง ๆ ของสไตล์ซีท คุณสมบัติที่เกี่ยวกับตัวอักษร.

งานนำเสนอที่คล้ายกัน


Ads by Google