วิธีเพิ่มรูปภาพในเว็บไซต์

สารบัญ:

วิธีเพิ่มรูปภาพในเว็บไซต์
วิธีเพิ่มรูปภาพในเว็บไซต์

วีดีโอ: วิธีเพิ่มรูปภาพในเว็บไซต์

วีดีโอ: วิธีเพิ่มรูปภาพในเว็บไซต์
วีดีโอ: HTML เบื้องต้น EP06 : การใส่รูปภาพให้กับเว็บไซต์ 2024, ธันวาคม
Anonim

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

วิธีเพิ่มรูปภาพในเว็บไซต์
วิธีเพิ่มรูปภาพในเว็บไซต์

คำแนะนำ

ขั้นตอนที่ 1

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

ขั้นตอนที่ 2

อัปโหลดรูปภาพไปยังเซิร์ฟเวอร์ที่โฮสต์ไซต์ของคุณ หรือคลังรูปภาพ (เช่น radikal.ru) คัดลอกที่อยู่ของรูปภาพและบันทึกลงในเอกสารข้อความ

ขั้นตอนที่ 3

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

ขั้นตอนที่ 4

หากคุณต้องการลบเส้นขอบ แท็กควรมีลักษณะดังนี้: ในทางกลับกัน หากคุณต้องการมีเส้นขอบรอบรูปภาพ ให้ระบุขนาดที่ต้องการเป็นพิกเซลแทนที่จะเป็นศูนย์ และด้วยความช่วยเหลือของแอตทริบิวต์ bordercolor คุณสามารถกำหนดสีเส้นขอบที่ต้องการได้ ตัวอย่างเช่น รูปภาพที่แท็กจะมีขอบสีดำขนาด 4 พิกเซล

ขั้นตอนที่ 5

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

ขั้นตอนที่ 6

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

ขั้นตอนที่ 7

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