นางสาวเบญจมาศ รัตน์พิทักษ์ การจัดหน้าเว็บเพจด้วยAP Element นางสาวเบญจมาศ รัตน์พิทักษ์

จุดประสงค์การเรียนรู้ ผู้เรียนเข้าใจหลักการจัดหน้าเว็บเพจด้วย AP Element ผู้เรียนสามารถจัดหน้าเว็บเพจด้วย AP Element รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

เนื้อหาสาระ การจัดหน้าเว็บเพจด้วย AP Element รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

AP Element AP Element (Absolutely Positioned Element) เดิมเรียกว่า เลเยอร์ (layer)เปรียบเสมือนแผ่นใสที่ สามารถใส่เนื้อหาต่างๆลงไปและนำมาวางเรียงช้อนกัน เป็นชั้นๆได้โดยเนื้อหาชั้นบนที่อยู่ถัดไปตามลำดับ ส่วน บริเวณที่ไม่มีเนื้อหาก็จะโปร่งใสทำให้มองผ่านไปเห็น ชั้นถัดไปได้ รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

AP Element ประโยชน์ของ AP Element คือใช้เอฟเฟ็คต์พิเศษ เช่น กำหนดให้แสดงหรือซ่อนเนื้อหาโดยขึ้นกับ เงื่อนไขต่างๆ และให้ผู้ชมลากย้าย AP Element ไป มาบนเว็บเพจได้ เป็นตน รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

การสร้าง AP Element วาดด้วยเครื่องมือ Draw AP Div วาด AP Element โดยใช้คำสั่ง Insert Layout Objects AP Div รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

การสร้าง AP Element คลิกวางเคอร์เซอร์ตรงตำแหน่งที่ต้องการ เลือก Layout Objects > AP Div รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

การใส่เนื้อหา AP Element หลังจากที่สร้าง AP Element แล้วจะปรากฏเคอร์เซอร์ขึ้น ภายในกรอบซึ่งสามารถพิมพ์ ข้อความหรือวางเนื้อหา ต่างๆได้ทันที แต่หากต้องการคลิกวางเคอร์เซอร์ใน AP Element ก่อนหรือไม่ก็ใช่วิธีลากออบเจ็คมาวาง โดยตรง รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

ซ่อน/แสดงเส้นกรอบAP Element view > visual aids > AP Element outlines และ CSS layout outlines แสดง ซ่อน รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

ซ่อน/แสดงจุดยึด AP Element Edit > Preferences จากเลือกหมวด Invisible Elements และ ดูที่ออปชั่น ซึ่งออปชั้นนี้จะต้องถูกเลือกไว้ ไม่เช่นนั้น จะไม่ สามารถซ่อน/แสดงจุดยึดของ AP Element รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

ซ่อน/แสดงจุดยึด AP Element เลือก view > Visual Aide > Invisible Elements คลิกปุ่ม แล้วเลือกคำสั่ง invisible Elements รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

เลือก AP Element 1. 2. รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

ปรับแต่ง AP Element กรณีเลือก 1 AP เดียว กรณีเลือกหลาย AP รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

การจัดเรียง AP Element รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์

เข้าสู่โปรแกรม รายวิชาการพัฒนาเว็บไซท์ด้วยโปรแกรมสำเร็จรูป ผู้สอน เบญจมาศ รัตน์พิทักษ์