HTML <img> src 属性
ການອະທິບາຍ ແລະ ການນໍາໃຊ້
ສະຫຼະການທີ່ຈຳຮວດ src
ທີ່ພິສູດ URL:
ມີສອງວິທີທີ່ຈະທຳນາຍ src
ທີ່ພິສູດ URL:
1. URL ສະພາບສະໝອງ - ທາງໄປຫາພາບພາບທີ່ບັນຈຸຢູ່ໃນເວັບໄຊອື່ນນັ້ນ. ເປັນຕົວຢ່າງ:
src="https://www.codew3c.com/images/img_girl.jpg"
ຄໍາເຕືອນ:ພາບພາບທີ່ຢູ່ພາຍໃນເວັບໄຊອື່ນນັ້ນອາດຖືກກັກກັບການສິດທິສິນລະປະສານ. ຖ້າເຈົ້າບໍ່ມີການຂອງການໃຊ້ມັນ, ມັນອາດຫຼີກການຮັບຜິດສັບສິດທິສິນລະປະສານ. ນອກຈາກນັ້ນ, ເຈົ້າບໍ່ສາມາດຄວບຄຸມພາບພາບທີ່ຢູ່ພາຍໃນເວັບໄຊອື່ນນັ້ນ; ມັນອາດຖືກຍ້າຍຫຼືປ່ຽນຫຼັງຈາກທີ່ເຈົ້າໄດ້ອົບພະຍາຍາມນຳໃຊ້.
2. URL ສະພາບສະໝອງ - ທາງໄປຫາພາບພາບທີ່ບັນຈຸຢູ່ໃນເວັບໄຊຂອງພວກເຮົາ.
ໃນນີ້, URL ບໍ່ບັນຈຸຊື່ຂອງໂດຍບາງການ. ຖ້າ URL ເລີ່ມດ້ວຍກາສາຍ, ມັນຈະສະພາບສະໝອງ. ເປັນຕົວຢ່າງ:
src="img_girl.jpg".
ຖ້າ URL ເລີ່ມດ້ວຍກາສາຍ, ມັນຈະສະພາບສະໝອງ. ເປັນຕົວຢ່າງ:
src="/images/img_girl.jpg".
Hint:ມັນອາດຈະດີຫຼາຍທີ່ຈະໃຊ້ URL ສະພາບສະໝອງ. ຖ້າເຈົ້າປ່ຽນຊື່ຂອງໂດຍບາງການ, ຈະບໍ່ມີການສິ້ນສຸດຕິການ.
ຄໍາເຕືອນ:ຖ້າບັນດານັກຄົ້ນຫາບໍ່ສາມາດຫາພາບໄດ້, ບັນດານັກຄົ້ນຫາຈະສະແດງສັນຍາລັກການທີ່ບຸກບັບແລະຂໍ້ຄວາມ alt.
Hint:ເພື່ອການຈັດການການກັກຂໍ້ມູນຂອງເອກະສານພາບພາບພວກເຮົາຈະພັດພະຍາຍາມບັນຈຸພາບພາບຢູ່ໃນຫ້ອງຂັ້ນອື່ນໆ. ແລະຈະພັດພະຍາຍາມບັນຈຸປະເພດຂອງຫ້ອງຂັ້ນອື່ນໆວ່າ "pics" ຫຼື "images" ແບບນັ້ນ. ໃນການສອນອອກຂອງ CodeW3C.com, ນັກການຄວາມສາຍຂອງພວກເຮົາຈະບັນຈຸພາບພາບທີ່ໃຊ້ຫຼາຍທີ່ສຸດໃນຫ້ອງຂັ້ນ "i", "i" ແມ່ນການການກົດຫຼັງ "images". ມັນມີຜົນດີຫຼາຍຕໍ່ກັບການຫຼຸດຕົວຕາມທາງ.
ຄວາມຄິດຕົວ
ໃນຄວາມຄິດຂອງພາຍຫຼັງນີ້ພວກເຮົາຈະສະເໜີຮູບພາບຕາມການຖ່າຍຂອງນັກການຄວາມສາຍຂອງ CodeW3C.com ທີ່ຖ່າຍຢູ່ສະໜາມຕົວກີນາງຫຼວງສະບານສະບັບຊາວຈີນທີ່ມີຊາວດອກສະຫຼາດນີ້. ຊື່ເອກະສານຮູບພາບຂອງພວກເຮົາແມ່ນ "eg_tulip.jpg", ບັນຈຸຢູ່ໃນຫ້ອງ "i" ຂອງຖານ. ນີ້ແມ່ນການຫຼັກການທີ່ຕາມ:
<img src="/i/eg_tulip.jpg" />
The effect of the above code:

Hint:ເຈົ້າສາມາດທົດລອງດ້ວຍອຸປະກອນທົດລອງອາຄານຂອງພວກເຮົາ:Try It Yourself،ຖ້າເຈົ້າປ່ຽນຊື່ຫຼັກຂໍ້ຄວາມທີ່ຢູ່ອານຸສາຍຂອງຄູ່ມືວ່າ "eg_chinarose.jpg", ເຈົ້າຈະເຫັນຮູບພາຍໃຫ້ທີ່ສະແດງສາຍພາຍນອກ. ຄືດັ່ງກ່າວ:
Source Code:
<img src="/i/eg_chinarose.jpg" />
The effect of the above code:

Syntax
<img src="URL">
Attribute Value
Value | Description |
---|---|
URL |
ກໍານົດ URL ສຳລັບພາບ. ຄວາມມູນຄ່າທີ່ສາມາດໃຊ້:
|
Browser Support
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
Support | Support | Support | Support | Support |