HTML படங்கள் என்றால் என்ன, உங்கள் வலைப்பக்கத்தை எவ்வாறு மாற்றுவது?



இந்த கட்டுரை உங்களுக்கு HTML படங்கள் பற்றிய விரிவான மற்றும் விரிவான அறிவையும், உங்கள் வலைப்பக்கத்தை அழகாக மாற்றுவதற்காக அதை எவ்வாறு சேர்க்கலாம் மற்றும் மாற்றியமைக்க முடியாது.

படங்கள் ஒரு வலைப்பக்கத்தின் மிக முக்கியமான பகுதியாகும், ஏனெனில் இது ஒரு வலைப்பக்கத்தின் தோற்றத்தை மேம்படுத்துகிறது மற்றும் வாடிக்கையாளர் தொடர்புகளை அதிகரிக்கிறது. பல வலைத்தளங்களின் யுஎஸ்பி அவர்கள் தங்கள் வலைப்பக்கங்களில் வெவ்வேறு படங்களை எவ்வாறு ஒழுங்கமைக்கிறார்கள் மற்றும் அதற்கு சுவைகளைச் சேர்ப்பது. இதில் படங்கள் கட்டுரை, பின்வரும் வரிசையில் HTML ஐப் பயன்படுத்தி ஒரு வலைப்பக்கத்தில் படங்களை எவ்வாறு உட்பொதிப்பது என்பதை நாங்கள் புரிந்துகொள்வோம்:

HTML இல் படத்தை எவ்வாறு சேர்ப்பது

ஒரு வலைப்பக்கத்தில் ஒரு படத்தை உட்பொதிக்க HTML உங்களுக்கு வழங்குகிறது குறிச்சொல். நினைவில் கொள்ள வேண்டிய மற்றொரு முக்கியமான விஷயம், இறுதி குறிச்சொல் இல்லை. scr படத்தின் பாதையை குறிப்பிட பண்புக்கூறு பயன்படுத்தப்படுகிறது, இது கணினி / சேவையகத்திலிருந்து ஒரு URL அல்லது பட பாதையாக இருக்கலாம். முதலில் HTML ஐப் பயன்படுத்தி ஒரு வலைப்பக்கத்தில் படத்தை உட்பொதிப்பதற்கான அடிப்படை தொடரியல் மூலம் ஆரம்பிக்கலாம்.





தொடரியல்

img src = 'img / front-end-web-development / 50 / what-are-html-images.png'>

மாதிரி குறியீடு



வலைப்பக்கத்தில் படங்களை உட்பொதித்தல்  

பிற குறிச்சொற்களைப் போலவே, தொடர்புடைய பல்வேறு பண்புகளும் உள்ளன குறிச்சொல். அவை ஒவ்வொன்றையும் ஒவ்வொன்றாகப் பார்ப்போம், அவற்றின் தேவை மற்றும் அவற்றை எவ்வாறு பயன்படுத்துவது என்பதைப் புரிந்துகொள்வோம்.

HTML படங்கள் குறிச்சொற்கள்

  • alt பண்புக்கூறு

Alt பண்புக்கூறு என்பது ஒரு படத்திற்கான மாற்று உரை. Alt பண்புக்கூறு அறிமுகப்படுத்தப்பட்டதற்கான காரணம் என்னவென்றால், எந்தவொரு காரணத்தினாலும் படத்தை ஏற்ற முடியவில்லை என்றால், ஒரு மாற்று உரை படத்தைப் பற்றி ஒரு கருத்தைத் தரும். படத்தை ஏற்றாததற்கான காரணங்கள் மெதுவான இணைய இணைப்பு அல்லது படம் வழங்கப்பட்ட மூலத்தில் இல்லை.



HTML கோப்பு இருக்கும் அதே கோப்புறையில் படம் இருந்தால், நீங்கள் கோப்பின் பெயரை நேரடியாக குறிப்பிடலாம். இல்லையெனில், படக் கோப்பின் முழுமையான பாதையை நீங்கள் வழங்க வேண்டும்.

Alt பண்புக்கூறு மதிப்பு படத்தை விவரிக்க வேண்டும்.

உதாரணமாக

 எடுரேகா லோகோ
வலைப்பக்கத்தில் படங்களை உட்பொதித்தல் edureka லோகோ 

ஜாவாவில் பாலிண்ட்ரோம் கண்டுபிடிப்பது எப்படி
  • ஒரு படத்தின் அகலமும் உயரமும்

ஒரு படத்தின் உயரத்தையும் அகலத்தையும் அமைக்க நடை பண்புக்கூறு பயன்படுத்தப்படுகிறது. பாணி பண்புக்கூறில் நீங்கள் CSS ஸ்டைலிங் குறிப்பிடுகிறீர்கள்.

வலைப்பக்கத்தில் படங்களை உட்பொதித்தல்  

HTML ஐப் பயன்படுத்தி ஒரு வலைப்பக்கத்தில் ஒரு படத்தை உட்பொதிக்கும்போது சில முக்கியமான புள்ளிகள்:

  • அகலம் மற்றும் உயர பண்புக்கூறுகள் பிக்சல்களில் வரையறுக்கப்பட்டுள்ளன.
  • ஒரு படத்தின் அகலம் மற்றும் உயரத்தை சதவீதத்தில் வரையறுக்கலாம். இது முழு வலைப்பக்கத்தின் படி சதவீதத்தை கருத்தில் கொள்ளும்.
   
  • அவற்றில் ஒன்றை மட்டுமே நீங்கள் குறிப்பிட்டால், அது மற்றதை அதற்கேற்ப சரிசெய்கிறது.
  • URL ஐப் பயன்படுத்தி படங்களை உட்பொதித்தல்

URL ஐக் குறிப்பிடுவதன் மூலம் வேறொரு சேவையகத்திலிருந்து படத்தை எடுக்கக்கூடிய நெகிழ்வுத்தன்மையையும் HTML வழங்குகிறது. படங்களை ஹோஸ்ட் செய்ய நீங்கள் ஒரு தனி சேவையகத்தைப் பயன்படுத்தலாம், பின்னர் அந்த படங்களை URL ஐப் பயன்படுத்தி உட்பொதிக்கலாம்.

வலைப்பக்கத்தில் படங்களை உட்பொதித்தல்  

  • ஒரு இணைப்பாக படம்

ஒரு புதிய வலைப்பக்கத்தில் பயனர் படத்தைக் கிளிக் செய்து தரையிறக்கும் இணைப்பாக படத்தைப் பயன்படுத்தலாம். அவ்வாறு செய்ய, நீங்கள் அதை வைக்க வேண்டும் நாள் குறிச்சொல்.

வலைப்பக்கத்தில் படங்களை உட்பொதித்தல்  

CSS மிதவை சொத்தைப் பயன்படுத்தி படத்தின் சீரமைப்பையும் நீங்கள் சரிசெய்யலாம். அனைத்து CSS சொத்துக்களும் பாணி பண்புக்கூறில் குறிப்பிடப்பட வேண்டும்.

HTML படம் படம் உரையின் வலதுபுறத்தில் மிதக்கும். படம் உரையின் இடதுபுறத்தில் மிதக்கும்.

HTML வழங்கிய முக்கியமான அம்சங்களில் இதுவும் ஒன்றாகும். பட வரைபடத்தை வரையறுக்க குறிச்சொல் உதவுகிறது. பட வரைபடம் என்றால் என்ன என்று நீங்கள் யோசித்துக்கொண்டிருக்க வேண்டும். பட-வரைபடம் என்பது கிளிக் செய்யக்கூடிய பகுதிகளைக் கொண்ட ஒரு படம்

HTML படம்  

வலைப்பக்கத்தில் பின்னணி படத்தையும் சேர்க்கலாம். நீங்கள் CSS சொத்தை அதாவது பாணி குறிச்சொல்லில் பின்னணி-படத்தைப் பயன்படுத்த வேண்டும் மற்றும் அதை HTML உறுப்புடன் சேர்க்க வேண்டும்.

HTML படம்

பின்னணி படம்

உடல் உறுப்பு

இதன் மூலம் இந்த HTML படங்கள் வலைப்பதிவின் முடிவுக்கு வருகிறோம்.இப்போது மேலே உள்ள துணுக்குகளை இயக்கிய பிறகு, HTML இல் படத்தை எவ்வாறு செருகுவது என்பதை நீங்கள் புரிந்துகொண்டிருப்பீர்கள். இந்த வலைப்பதிவு உங்களுக்கு தகவல் மற்றும் கூடுதல் மதிப்பு என்று நம்புகிறேன்.

முதுகலை சான்றிதழ் Vs முதுநிலை

எங்கள் பாருங்கள் இது பயிற்றுவிப்பாளர் தலைமையிலான நேரடி பயிற்சி மற்றும் நிஜ வாழ்க்கை திட்ட அனுபவத்துடன் வருகிறது. இந்த பயிற்சி பின்-முனை மற்றும் முன்-வலை வலை தொழில்நுட்பங்களுடன் பணிபுரியும் திறன்களில் நீங்கள் தேர்ச்சி பெறுகிறது. வலை அபிவிருத்தி, jQuery, கோணல், நோட்ஜெஸ், எக்ஸ்பிரஸ்ஜேஎஸ் மற்றும் மோங்கோடிபி பற்றிய பயிற்சி இதில் அடங்கும்.

எங்களுக்கு ஒரு கேள்வி கிடைத்ததா? 'HTML படங்கள்' வலைப்பதிவின் கருத்துகள் பிரிவில் இதைக் குறிப்பிடவும், நாங்கள் உங்களைத் தொடர்புகொள்வோம்.