HTML Div Tag <div> in Tamil - linto.in
<div> tag ஒரு empty container, இது ஒரு division அல்லது section-ஆகா வரையறுக்கிறது. css பயன்படுத்தாமல் இதில் எந்த ஒரு effect-யும் கொண்டுவர இயலாது. css-ஐ பயன்படுத்தி நமக்கு பிடித்த வடிவத்தில் இதை மாற்றி கொள்ளலாம்.
HTML <div> Tag
<div> tag ஒரு empty container, இது ஒரு division அல்லது section-ஆகா வரையறுக்கிறது. css பயன்படுத்தாமல் இதில் எந்த ஒரு effect-யும் கொண்டுவர இயலாது. css-ஐ பயன்படுத்தி நமக்கு பிடித்த வடிவத்தில் இதை மாற்றி கொள்ளலாம்.
<div> tag-க்கு முன்னும் பின்னும் அதுவாகவே ஒரு break line-ஐ ஏற்படுத்திக்கொள்ளும். ஆகையால் இதை பயன்படுத்தும்போது எப்போதும் ஒரு தனி line ஆகத்தான் இருக்கும்.
Example
Try this code<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div>This is a wonderful day, I have never seen this one before.</div>
<div>Nothing makes a woman more beautiful than the belief that she is beautiful.</div>
<div>You may be one person to the world but <div>you may also be the world to one person.</div> </div>
</body>
</html>
Output:
<div> tag with style
Example
Try this code<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<div class="div-style">This is a wonderful day, I have never seen this one before.</div>
<div class="div-style">Nothing makes a woman more beautiful than the belief that she is beautiful.</div>
<div class="div-style">You may be one person to the world but <div class="div-style">you may also be the world to one person.</div> </div>
<style>
.div-style{
margin-bottom: 5px;
border:1px solid #111;
}
</style>
</body>
</html>
Output:
We recommend to use <div> tag only when no other semantic elements introduced in HTML5 (such as <nav> , <main> or <article>) are appropriate.
You can place any HTML element within the <div> tag, including another <div>.
<p> tag-ன் உள்ளே <div> tag இருக்க முடியாது. ஏனெனில் <div> tag-ஐ உள்ளே enter செய்யப்பட்ட உடன் வெளியில் உள்ள <p> tag-ஐ அது உடைத்துவிட்டு மீண்டும் <div> tag மட்டும் தனித்து செயல்பட ஆரம்பித்துவிடும்.
To apply styles inside a paragraph use <span> tag, which is used with inline elements.
<div> with in <p> with style
Example
Try this code<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
</head>
<body>
<p class="pstyle">
This is a wonderful day, I have never
<div class="dstyle1">seen this one before.</div>
I don’t like standard beauty
</p>
<p class="pstyle">Nothing makes a woman more beautiful than the <div class="dstyle1">belief that she is beautiful.</div> To be beautiful means to be yourself</p>
<p class="pstyle">You may be one person to the world but <div class="dstyle1">you may also be the world to one person.</div> You don’t need to be accepted by others. </p>
<style>
.dstyle1{
padding: 5px;
background-color: lightyellow;
}
.pstyle{
border:1px solid #006699;
background-color: lightsteelblue;
border: 1px solid #D7B740;
}
</style>
</body>
</html>
Output:
This is a wonderful day, I have never
Nothing makes a woman more beautiful than the
You may be one person to the world but