Jassif Team Institution

HTML Block and Inline Elements

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

இரண்டு மிகவும் பொதுவான காட்சி மதிப்புகள் தொகுதி மற்றும் உள்வரி ஆகும்.

தொகுதி-நிலை உறுப்புகள்

ஒரு தொகுதி-நிலை உறுப்பு எப்போதும் ஒரு புதிய வரியில் தொடங்குகிறது, மற்றும் உலாவிகள் தானாக சில இடத்தை (ஒரு விளிம்பு) உறுப்புக்கு முன்னும் பின்னும் சேர்க்கின்றன.

ஒரு தொகுதி-நிலை உறுப்பு எப்போதும் கிடைக்கக்கூடிய முழு அகலத்தையும் எடுக்கும் (இடது மற்றும் வலது பக்கமாக முடிந்தவரை நீட்டிக்கும்).

இரண்டு பொதுவாகப் பயன்படுத்தப்படும் தொகுதி உறுப்புகள்: <p> மற்றும் <div>.

<p> உறுப்பு ஒரு HTML ஆவணத்தில் ஒரு பத்தியை வரையறுக்கிறது.

<div> உறுப்பு ஒரு HTML ஆவணத்தில் ஒரு பிரிவு அல்லது பகுதியை வரையறுக்கிறது.

<p> உறுப்பு ஒரு தொகுதி-நிலை உறுப்பு.

<div> உறுப்பு ஒரு தொகுதி-நிலை உறுப்பு.

<p>Hello World</p>
<div>Hello World</div>

HTML இல் உள்ள தொகுதி-நிலை உறுப்புகள் இங்கே:

உள்வரி உறுப்புகள்

ஒரு உள்வரி உறுப்பு புதிய வரியில் தொடங்காது.

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

இது ஒரு பத்திக்குள் ஒரு <span> உறுப்பு.

<span>Hello World</span>

HTML இல் உள்ள உள்வரி உறுப்புகள் இங்கே:

தொகுதி vs உள்வரி

<div> உறுப்பு

<div> உறுப்பு பெரும்பாலும் பிற HTML உறுப்புகளுக்கான கொள்கலனாகப் பயன்படுத்தப்படுகிறது.

<div> உறுப்புக்கு தேவையான பண்புக்கூறுகள் இல்லை, ஆனால் style, class மற்றும் id பொதுவானவை.

CSS உடன் சேர்ந்து பயன்படுத்தப்படும் போது, <div> உறுப்பு உள்ளடக்க தொகுதிகளை அலங்கரிக்க பயன்படுத்தப்படலாம்:

<div style="background-color:black;color:white;padding:20px;">
  <h2>London</h2>
  <p>London is the capital city of England. It is the most populous city in the United Kingdom, with a metropolitan area of over 13 million inhabitants.</p>
</div>

அடுத்த அத்தியாயத்தில் <div> உறுப்பு பற்றி மேலும் கற்றுக்கொள்வீர்கள்.

<span> உறுப்பு

<span> உறுப்பு ஒரு உரையின் பகுதியை அல்லது ஒரு ஆவணத்தின் பகுதியைக் குறிக்கப் பயன்படும் உள்வரி கொள்கலன் ஆகும்.

<span> உறுப்புக்கு தேவையான பண்புக்கூறுகள் இல்லை, ஆனால் style, class மற்றும் id பொதுவானவை.

CSS உடன் சேர்ந்து பயன்படுத்தப்படும் போது, <span> உறுப்பு உரையின் பகுதிகளை அலங்கரிக்க பயன்படுத்தப்படலாம்:

<p>My mother has <span style="color:blue;font-weight:bold;">blue</span> eyes and my father has <span style="color:darkolivegreen;font-weight:bold;">dark green</span> eyes.</p>

அத்தியாய சுருக்கம்

• ஒரு தொகுதி-நிலை உறுப்பு எப்போதும் ஒரு புதிய வரியில் தொடங்குகிறது மற்றும் கிடைக்கக்கூடிய முழு அகலத்தையும் எடுக்கும்
• ஒரு உள்வரி உறுப்பு புதிய வரியில் தொடங்குவதில்லை மற்றும் தேவையான அகலத்தை மட்டுமே எடுக்கும்
• <div> உறுப்பு ஒரு தொகுதி-நிலை உறுப்பு மற்றும் பெரும்பாலும் பிற HTML உறுப்புகளுக்கான கொள்கலனாகப் பயன்படுத்தப்படுகிறது
• <span> உறுப்பு ஒரு உரையின் பகுதியை அல்லது ஒரு ஆவணத்தின் பகுதியைக் குறிக்கப் பயன்படும் உள்வரி கொள்கலன் ஆகும்

பயிற்சி

HTML குறிச்சொற்கள்