วิธีทำหัวยางสำหรับเว็บไซต์

สารบัญ:

วิธีทำหัวยางสำหรับเว็บไซต์
วิธีทำหัวยางสำหรับเว็บไซต์
Anonim

เมื่อสร้างเว็บไซต์บนอินเทอร์เน็ต สิ่งสำคัญที่สุดประการหนึ่งที่นักพัฒนาซอฟต์แวร์ต้องคำนึงถึงคือฟังก์ชัน ความสามารถรอบด้าน และประสิทธิภาพ เพื่อให้ไซต์แสดงได้อย่างสมบูรณ์และถูกต้องในเบราว์เซอร์บนคอมพิวเตอร์ที่มีความละเอียดหน้าจอที่หลากหลาย คุณสามารถสร้างส่วนหัว "ยาง" ที่สะดวกซึ่งประกอบด้วยองค์ประกอบกราฟิกหลายอย่าง

วิธีทำหัวยางสำหรับเว็บไซต์
วิธีทำหัวยางสำหรับเว็บไซต์

คำแนะนำ

ขั้นตอนที่ 1

ในขั้นตอนแรกของการสร้างส่วนหัวดังกล่าวสำหรับเว็บไซต์ ให้เปิดรูปภาพที่คุณได้เตรียมไว้สำหรับการโพสต์บนเว็บใน Photoshop แล้วตัดเป็นชิ้นๆ โดยใช้ Slice Tool ในแถบเครื่องมือ ตัดส่วนหัวเพื่อให้ส่วนตรงกลางว่างเปล่า เพื่อให้คุณได้องค์ประกอบกราฟิกสามรายการ ซึ่งจะทำให้ส่วนหัวขยายสำหรับความละเอียดหน้าจอใดๆ

ขั้นตอนที่ 2

หลังจากที่คุณตัดส่วนหัวแล้ว ให้บันทึกโดยปรับไฟล์ให้เหมาะสมเมื่อบันทึกสำหรับรูปแบบเว็บ (บันทึกสำหรับเว็บ) ตั้งค่ารูปแบบไฟล์ที่ต้องการสำหรับการบันทึก เช่น gif, jpeg หรือ.png

ขั้นตอนที่ 3

หลังจากบันทึกรูปภาพแล้ว ให้แก้ไขโค้ด HTML โดยเปิดเอกสาร html ที่บันทึกไว้ด้วย Notepad ในแผ่นจดบันทึก ให้ลบบรรทัดโค้ดที่ไม่จำเป็นทั้งหมด เหลือเพียงบรรทัดที่จำเป็น - ข้อมูลเกี่ยวกับตารางที่ฝังรูปภาพของคุณ:

ขั้นตอนที่ 4

ในบรรทัดเหล่านี้ แทนที่จะระบุ yourimage

ขั้นตอนที่ 5

เพื่อให้ส่วนตรงกลางของภาพยืดออก โดยกระจายภาพสุดขั้วไปด้านข้าง ให้เขียนแอตทริบิวต์รหัสที่เกี่ยวข้องในบรรทัด ระบุพารามิเตอร์ความกว้างและความสูงของคุณเองในโค้ด

ขั้นตอนที่ 6

อัปโหลดรูปภาพส่วนหัวที่สร้างขึ้นไปยังไดเร็กทอรีรากของไซต์ของคุณ แล้วแก้ไขโค้ด HTML ด้วยเส้นทางใหม่ไปยังรูปภาพส่วนหัวบนเซิร์ฟเวอร์ วางโค้ดส่วนหัวระหว่างแท็ก