பல உடைக்காத இடைவெளிகளுக்குப் பதிலாக டேப் ஸ்பேஸ் (“ ”)?

Pala Utaikkata Itaivelikalukkup Patilaka Tep Spes Nbsp



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

இந்தச் சிக்கல்களைச் சமாளிக்க, HTML ஆவணத்தில் பல உடைக்காத இடங்களைச் சேர்க்க வேறு பல வழிகள் உள்ளன. <முன்> ”,” 'உறுப்புகள், CSS' விளிம்பு-இடது ”,” திணிப்பு-இடது ” பண்புகள் மற்றும் பல.

இந்த ஆய்வு உங்களுக்கு கற்பிக்கும்:







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



' ' ஐப் பயன்படுத்தி இடைவெளிகளைச் சேர்ப்பது எப்படி HTML இல் உள்ள நிறுவன குறியீடு?

'ஐப் பயன்படுத்தி இடைவெளிகளைச் சேர்க்க   HTML பக்கத்தில், வழங்கப்பட்ட படிகளைப் பின்பற்றவும்:



  • ஒரு div உறுப்பைச் சேர்த்து அதற்கு ஒரு வகுப்பை ஒதுக்கவும் ' கட்டுரை ”.
  • அதன் பிறகு, ஒரு 'வை'

    ” என்ற தலைப்புக்கான உறுப்பு.

  • பின்னர், '' சேர்க்கவும்

    ஒரு பத்தியைச் சேர்க்க உறுப்பு. பத்தியின் தொடக்கத்தில், நிறுவனக் குறியீட்டைக் குறிப்பதன் மூலம் இடைவெளிகள் சேர்க்கப்படுகின்றன '   ”:

< div வர்க்கம் = 'கட்டுரை' >
< h2 > அறிவே ஆற்றல் < / h2 >
< >     அறிவு என்பது சக்தி என்பது ஒரு படித்த மனிதன் அறிவின் வலிமையின் மூலம் தனது வாழ்க்கையை முழுமையாகக் கட்டுப்படுத்துவதைக் குறிக்கிறது. < / >
< / div >

பத்தியின் தொடக்கத்தில் இடைவெளிகள் வெற்றிகரமாக சேர்க்கப்பட்டுள்ளதைக் காணலாம்:





HTML “” உறுப்பைப் பயன்படுத்தி தாவல் இடத்தை எவ்வாறு சேர்ப்பது?

HTML ' ” என்பது ஒரு ஆவணத்தின் ஒரு பகுதியைக் குறிக்கப் பயன்படுத்தப்படும் இன்லைன் உறுப்பு. தற்போதைய எடுத்துக்காட்டில், '' உடன் உறுப்பைச் சேர்த்துள்ளோம். தாவல் ” ஐடி. இடத்தை உருவாக்க இந்த உறுப்பு CSS இல் வடிவமைக்கப்பட்டுள்ளது:



< div வர்க்கம் = 'கட்டுரை' >
< h2 > அறிவே சக்தி< / h2 >
< > < இடைவெளி ஐடி = 'தாவல்' >< / இடைவெளி > அறிவு என்பது சக்தி என்பது ஒரு படித்த மனிதன் அறிவின் மூலம் தனது வாழ்க்கையை முழுமையாகக் கட்டுப்படுத்திக் கொண்டிருப்பதைக் குறிக்கிறது இன் வலிமை.


பாணி 'கட்டுரை' div

.கட்டுரை {
விளிம்பு: ஆட்டோ;
அகலம் : 400px;
திணிப்பு: 10px;
}

' .கட்டுரை '' ஐ அணுக பயன்படுகிறது

” குறிச்சொற்கள், இது பின்வரும் பண்புகளுடன் பயன்படுத்தப்படுகிறது:

  • ' அகலம் 'சொத்து உறுப்புகளின் அகலத்தை தீர்மானிக்கிறது.
  • ' விளிம்பு 'சொத்து உறுப்பின் உயரத்தை தீர்மானிக்கிறது.
  • ' திணிப்பு 'உறுப்பின் உள்ளடக்கத்தைச் சுற்றி இடத்தை உருவாக்குகிறது.

பாணி 'தாவல்' ஐடி

#தாவல் {
திணிப்பு-இடது: 8px;
}

' #தாவல் 'அணுக' தாவல் உறுப்பு ஐடி மற்றும் பயன்படுத்தவும் திணிப்பு-இடது ”அதில் சொத்து.

வெளியீடு

HTML “
” உறுப்பைப் பயன்படுத்தி Tab Space ஐ எவ்வாறு சேர்ப்பது?

' <முன்> 'உறுப்பு முன் வடிவமைக்கப்பட்ட உரையை வரையறுக்கிறது.

 உறுப்புக்குள் உள்ள உரை அப்படியே வலைப்பக்கத்தில் காட்டப்படும்.

முதலில் HTML பக்கத்தை உருவாக்குவதன் மூலம் உதாரணத்தை மேலோட்டமாக பார்க்கவும்:

  • சேர் '

    ஆவணத்தில் நிலை இரண்டின் தலைப்பை அமைக்க உறுப்பு.

  • பின்னர், '' <முன்> ” குறியிட்டு, விரும்பிய வடிவமைப்புடன் உள்ளடக்கத்தைக் குறிப்பிடவும்:
< h2 >HTML முன் குறிச்சொல்< / h2 >
< முன் >
செயல்பாடு தயாரிப்பு செயல்பாடு ( p1, p2 ) {
திரும்ப p1 * p2;
}
< / முன் >

வெளியீடு

CSS “மார்ஜின்-இடது” பண்பைப் பயன்படுத்தி தாவல் இடத்தை எவ்வாறு சேர்ப்பது?

CSS ஐப் பயன்படுத்தி தாவல் இடத்தைச் சேர்க்க ' விளிம்பு-இடது 'சொத்து, வழங்கப்பட்ட நடைமுறையைப் பின்பற்றவும்:

  • முதலில், ஆவணத்தில் ஒரு div உறுப்பைச் சேர்த்து அதற்கு ஒரு வகுப்பை ஒதுக்கவும் ' படங்கள் ”.
  • இந்த div உறுப்புக்குள், வகுப்புடன் மேலும் இரண்டு div கூறுகளைச் சேர்க்கவும். img-1 'மற்றும்' img-2 ' முறையே.
  • இந்த இரண்டு DIV உறுப்புகளில் ஒவ்வொன்றும் '' ஐப் பயன்படுத்தி குறிப்பிடப்பட்ட படங்களைக் கொண்டுள்ளது ” குறிச்சொல்.
  • இந்த ' 'குறிச்சொற்கள்' உடன் தொடர்புடையவை src 'மற்றும்' அகலம் ” பண்புக்கூறுகள். 'src' பண்புக்கூறு படத்தின் URL ஐக் குறிப்பிடுகிறது, மேலும் 'அகலம்' பண்புக்கூறு படத்தின் அகலத்தை சரிசெய்கிறது.

மேலே விவாதிக்கப்பட்ட காட்சியின் HTML குறியீடு இங்கே:

< div வர்க்கம் = 'படங்கள்' >
< div வர்க்கம் = 'img-1' >
< img src = '/spring-images/marguerite-flower.jpg' அகலம் = '250' >
< / div >
< div வர்க்கம் = 'img-2' >
< img src = '/spring-images/flower-ga8f105f1d_1920.jpg' அகலம் = '250' >
< / div >
< / div >

HTML பக்கம் இப்படி இருக்கும்:

பல இடங்களைச் சேர்க்க CSS பிரிவை நோக்கிச் செல்லலாம் ' img-2 பல உடைக்காத இடைவெளிகளைப் பயன்படுத்தாமல் வகுப்பு.

பாணி 'படங்கள்' div

.படங்கள் {
அகலம் : 500px;
விளிம்பு: ஆட்டோ;
}

' .படங்கள் '' ஐக் கொண்டிருக்கும் HTML டிவியை அணுக பயன்படுகிறது படங்கள் ' வர்க்கம். மேலே கூறப்பட்ட பண்புகளின் விளக்கம் பின்வருமாறு:

  • ' அகலம் 'சொத்து உறுப்புகளின் அகலத்தை தீர்மானிக்கிறது.
  • ' விளிம்பு 'உறுப்பின் பக்கங்களைச் சுற்றியுள்ள இடத்தை சொத்து தீர்மானிக்கிறது.

பாணி 'img-2' div
'ஐப் பயன்படுத்தி div உறுப்பை அணுகவும் .img-2 ”:

.img- 2 {
விளிம்பு-இடது: 30px;
}

' விளிம்பு-இடது 'ஒரு' கொண்ட சொத்து 30px 'வகுப்பைக் கொண்ட HTML DIV உறுப்புக்கு மதிப்பு பயன்படுத்தப்படுகிறது' img-2 ”. இந்த பண்பு உறுப்புக்கு இடதுபுறத்தில் 30px இடத்தை சேர்க்கும்.

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

பல உடைக்காத இடைவெளிகளைப் பயன்படுத்துவதற்குப் பதிலாக டேப் ஸ்பேஸ்களைச் சேர்ப்பது பற்றி விரிவாகக் கூறியுள்ளோம் '   ”.

முடிவுரை

HTML இல், '   ” நிறுவனக் குறியீடு பொதுவாக ஆவணத்தில் உடைக்காத இடத்தைச் சேர்க்கப் பயன்படுத்தப்படுகிறது. இந்த நிறுவனக் குறியீட்டைப் பலமுறை பயன்படுத்துவதைத் தவிர்க்க, ஆவணத்தில் தாவல் இடத்தைச் சேர்க்க வேறு வழிகள் உள்ளன. இந்த முறைகளில் HTML பயன்பாடு அடங்கும். <முன்> ”,” 'கூறுகள்,' விளிம்பு-இடது ”சொத்து, மற்றும் பல. பல “ ” ஐச் சேர்ப்பதற்குப் பதிலாக HTML ஆவணத்தில் தாவல் இடைவெளிகளைச் சேர்க்க உதவும் பல வழிகளை இந்த வலைப்பதிவு குறிப்பிட்டுள்ளது. நிறுவன குறியீடுகள்.