ไซต์ที่มีรูปลักษณ์ที่น่าดึงดูดเป็นที่นิยมของผู้เยี่ยมชม เพื่อปรับปรุงรูปลักษณ์ของทรัพยากร เจ้าของมักจะเปลี่ยนการออกแบบทั้งหมดหรือบางส่วน น่าเสียดายที่การเพิ่มองค์ประกอบที่มีสีสันใหม่สำหรับการตกแต่งหน้านั้นใช้เวลานาน วิธีที่รวดเร็วในการดึงดูดความสนใจของผู้เยี่ยมชมทรัพยากรคือการแทนที่เคอร์เซอร์ปกติด้วยรูปภาพขนาดเล็ก ในการติดตั้งองค์ประกอบดังกล่าวบนไซต์ คุณต้องทำตามขั้นตอนง่ายๆ สองสามขั้นตอน
มันจำเป็น
- - เว็บไซต์ของตัวเอง
- - มีความรู้พื้นฐานเกี่ยวกับ HTML. เป็นอย่างน้อย
- - รู้ว่าโค้ด CSS อยู่ที่ไหนบนไซต์
คำแนะนำ
ขั้นตอนที่ 1
ขั้นแรก ดาวน์โหลดรูปภาพที่จะมาแทนที่ตัวชี้บนไซต์ รูปภาพของรูปแบบกราฟิกทั่วไป (.bmp,.gif,.jpg,.png
ขั้นตอนที่ 2
หากต้องการแทนที่ตัวชี้ คุณต้องมีรูปภาพในรูปแบบ.cur หรือ.ani เพื่อให้ได้ภาพดังกล่าว ให้ค้นหารูปภาพที่ออกแบบมาเป็นพิเศษสำหรับเคอร์เซอร์ทางอินเทอร์เน็ต ส่วนขยาย.cur นั้นเฉพาะสำหรับภาพนิ่ง และส่วนขยาย.ani นั้นเฉพาะสำหรับภาพเคลื่อนไหว บันทึกไฟล์ที่คุณต้องการลงในคอมพิวเตอร์ของคุณ
ขั้นตอนที่ 3
แต่เพื่อเปลี่ยนตัวชี้ ไม่จำเป็นต้องถ่ายภาพที่เสร็จแล้วเลย หากคุณต้องการสร้างรูปภาพด้วยตัวเอง ให้ใช้หนึ่งในโปรแกรมพิเศษเพื่อสร้างเคอร์เซอร์หรือแปลงรูปแบบไฟล์กราฟิก
ขั้นตอนที่ 4
กรอกรูปภาพสำหรับเคอร์เซอร์บนเว็บไซต์ จากนั้นในโค้ดทรัพยากร ให้ค้นหาแท็กและทำการเปลี่ยนแปลงต่อไปนี้:
แทนที่จะเขียน "images / 1.ani" ให้ระบุเส้นทางไปยังรูปภาพที่อัปโหลดไปยังไซต์ของคุณ
ขั้นตอนที่ 5
หากคุณต้องการให้เคอร์เซอร์อยู่ในรูปแบบของภาพเดียวเมื่อวางเมาส์เหนือลิงก์ และเมื่อไม่มีองค์ประกอบลิงก์ - ให้ดูเหมือนภาพอื่น ควรใช้ CSS เพื่อเปลี่ยนตัวชี้ หากต้องการทำการเปลี่ยนแปลงดังกล่าว ก่อนอื่นให้อัปโหลดไฟล์อื่นที่มีนามสกุล.cur หรือ.ani ไปยังไซต์
ขั้นตอนที่ 6
จากนั้น ใน CSS ของไซต์ของคุณ ให้สร้างรายการ "body {cursor: url ('1.ani');}" แทน "1.ani" ให้ระบุเส้นทางไปยังรูปภาพหลักสำหรับเคอร์เซอร์ที่อัปโหลดไปยัง เว็บไซต์. รหัสนี้เพิ่มคุณสมบัติเพื่อเปลี่ยนเคอร์เซอร์ไปที่รูปภาพที่ระบุไปยังแท็กที่มีการเขียนเนื้อหาของหน้าทั้งหมดของทรัพยากร
ขั้นตอนที่ 7
จากนั้นเขียนบรรทัด "a {เคอร์เซอร์: url ('2.ani');}" ใน CSS โดยแทนที่ "2.ani" ด้วยเส้นทางไปยังรูปภาพเคอร์เซอร์ที่อัปโหลดไปยังทรัพยากร ซึ่งควรปรากฏขึ้นเมื่อวางตัวชี้ไว้เหนือ ลิงก์ รายการที่สร้างขึ้นช่วยให้คุณสามารถแทนที่เคอร์เซอร์ด้วยรูปภาพที่เกี่ยวข้องเมื่อตัวชี้คลิกลิงก์ใด ๆ บนไซต์ เนื่องจากจะทำการเปลี่ยนแปลงคุณสมบัติแท็ก