ایچ تی ام ال<div> تگ
تعریف اور استعمال
<div> تگ، ایچ اینگل کے ڈوکومنٹ میں تقسیم یا حصوں کی تعریف کرتی ہے (منطق یا شعبہ، تقسیم/شعبہ)۔
<div> لبلب کے ذریعہ ڈوکومنٹ کو آزاد، مختلف حصوں میں تقسیم کیا جاسکتا ہے۔ یہ ایک سخت منظم ابزار کے طور پر استعمال کیا جاسکتا ہے اور کسی فرمت سے منسلک نہیں ہوتا۔
任何类型的内容都可以放在 <div> 标签内！<div> 标签可用作 HTML 元素的容器，然后使用 CSS 设置样式或使用 JavaScript 进行操作。
ਟੈਗ ਦੇ ਉਪਯੋਗ ਵਿੱਚ id ਜਾਂ class ਇਸ ਨੂੰ <div>ਇਸ ਨੂੰ class ਜਾਂ id ਪ੍ਰਤੀਕ, ਤਾਂ ਇਹ ਟੈਗ ਦੇ ਕੰਮ ਵਿੱਚ ਵਧੇਰੇ ਪ੍ਰਭਾਵਸ਼ਾਲੀ ਹੁੰਦਾ ਹੈ। ਇਸ ਦੇ ਲਈ <div> ਟੈਗ ਸਟਾਈਲ ਸੈੱਟ ਵਿੱਚ ਸਟਾਈਲ ਸੈੱਟ ਵਿੱਚ ਰਹਿੰਦਾ ਹੈ।
ਧਿਆਨ:ਮੂਲ ਰੂਪ ਵਿੱਚ, ਬਰਾਉਜ਼ਰ ਹਰੇਕ ਟੈਗ ਸਟਾਈਲ ਸੈੱਟ ਵਿੱਚ ਰਹਿੰਦਾ ਹੈ। <div> ਇਲੈਕਟ੍ਰੌਨਿਕ ਅੰਗ ਦੇ ਪਹਿਲਾਂ ਅਤੇ ਬਾਅਦ ਇੱਕ ਨਵੀਂ ਲਾਈਨ ਪਾਇਆ ਜਾਂਦਾ ਹੈ।
ਵਰਤੋਂ
<div> ਬਲਕ ਇਲੈਕਟ੍ਰੌਨਿਕ ਅੰਗ ਹੈ। ਇਹ ਮਤਲਬ ਕਿ ਇਸ ਦਾ ਕੰਟੈਂਟ ਆਪਣੇ ਆਪ ਹੀ ਇੱਕ ਨਵੀਂ ਲਾਈਨ ਦੇ ਸ਼ੁਰੂ ਵਿੱਚ ਸ਼ੁਰੂ ਹੁੰਦਾ ਹੈ। ਇਸ ਪ੍ਰਕਾਰ, ਬਦਲਾਅ ਇਲੈਕਟ੍ਰੌਨਿਕ ਅੰਗ ਦੇ ਪਹਿਲਾਂ ਅਤੇ ਬਾਅਦ ਪਾਇਆ ਜਾਂਦਾ ਹੈ। <div> ਮੂਲ ਵਿਲੱਖਣ ਫਾਰਮੈਟਿੰਗ ਪ੍ਰਦਰਸ਼ਨ ਦਾ ਹੈ। ਇਹ ਇਕੱਲੇ ਹੀ <div> ਦੇ class ਜਾਂ id ਅਤਿਰਿਕਤ ਸਟਾਈਲ ਐਪਲੀਕੇਸ਼ਨ ਲਈ
ਹਰੇਕ ਨੂੰ <div> ਨੂੰ ਵੀ ਕਲਾਸ ਜਾਂ id ਨਾਲ ਜੋੜ ਸਕਦੇ ਹਾਂ, ਹਾਲਾਂਕਿ ਇਸ ਦਾ ਕੁਝ ਲਾਭ ਵੀ ਹੈ।
ਇੱਕ ਹੀ <div> ਅੰਗ ਐਪਲੀਕੇਸ਼ਨ class ਜਾਂ id ਪੈਰਾਮੀਟਰ, ਲੇਕਿਨ ਬਹੁਤ ਸਾਰੇ ਮਾਮਲਿਆਂ ਵਿੱਚ ਸਿਰਫ਼ ਇੱਕ ਹੀ ਵਰਤਿਆ ਜਾਂਦਾ ਹੈ। ਇਨ੍ਹਾਂ ਦਰਮਿਆਨ ਮੁੱਖ ਅੰਤਰ ਇਹ ਹੈ ਕਿ class ਇਲੈਕਟ੍ਰੌਨਿਕ ਸਮੂਹ (ਸਮਾਨ ਅੰਗ, ਜਾਂ ਇੱਕ ਜਿਸ ਤਰ੍ਹਾਂ ਦੇ ਅੰਗ) ਦੇ ਲਈ ਵਰਤੀ ਜਾਂਦੀ ਹੈ, ਜਦਕਿ id ਇੱਕ ਅਲੱਗ-ਅਲੱਗ ਅਤੇ ਇੱਕੋ ਹੀ ਵਾਰ ਵਰਤੀ ਜਾਣ ਵਾਲੇ ਅੰਗ ਦੇ ਲਈ ਵਰਤੀ ਜਾਂਦੀ ਹੈ。
ਹੋਰ ਦੇਖੋ:
HTML ਸਿੱਖਿਆ:HTML ਦੇ ਬਲਾਕ ਇਲੈਮੈਂਟ ਅਤੇ ਇਨਲਾਈਨ ਇਲੈਮੈਂਟ
HTML ਸਿੱਖਿਆ:HTML ਦਾ ਲੇਆਊਟ
HTML DOM ਸੂਚੀਬੱਧ:Div ਆਬੋਹਵਾ
ਉਦਾਹਰਣ
ਦਸਤਾਵੇਜ਼ ਵਿੱਚ ਵਰਤੇ ਜਾਣ ਵਾਲੇ CSS ਸਟਾਈਲ ਦੇ <div> ਅੰਗ:
<html>
<head>
<style>
.myDiv {
border: 5px outset red;
background-color: lightblue;
text-align: center;
}
</style>
</head>
<body>
<div class="myDiv">
<h2>ਇਹ div ਅੰਗ ਵਿੱਚ ਸਿਰਲੇਖ ਹੈ</h2>
<p>ਇਹ div ਅੰਗ ਵਿੱਚ ਕੁਝ ਲਿਖਤ ਹੈ。</p>
</div>
</body>
</html>
ਮਾਮਲਾ ਵਿਆਖਿਆ
<body> <h1>ਨਵਾਂ ਸਾਈਟ</h1> <p>ਕੁਝ ਲਿਖਤ। ਕੁਝ ਲਿਖਤ। ਕੁਝ ਲਿਖਤ...</p> ... <div class="news"> <h2>ਨਿਊਜ਼ ਹੈੱਡਲਾਈਨ 1</h2> <p>ਕੁਝ ਲਿਖਤ। ਕੁਝ ਲਿਖਤ। ਕੁਝ ਲਿਖਤ...</p> ... </div> <div class="news"> <h2>ਨਿਊਜ਼ ਹੈੱਡਲਾਈਨ 2</h2> <p>ਕੁਝ ਲਿਖਤ। ਕੁਝ ਲਿਖਤ। ਕੁਝ ਲਿਖਤ...</p> ... </div> ... </body>
ਉਦਾਹਰਣ ਵਿਆਖਿਆ
ਜਿਵੇਂ ਤੁਸੀਂ ਦੇਖਦੇ ਹੋ, ਉੱਪਰ ਦਾ ਇਹ HTML ਨਿਊਜ਼ ਵੈੱਬਸਾਈਟ ਦੀ ਰੂਪਰੇਖਾ ਨੂੰ ਪ੍ਰਦਰਸ਼ਿਤ ਕਰਦਾ ਹੈ। ਹਰੇਕ div ਨਿਊਜ਼ ਦੇ ਸਿਰਲੇਖ ਅਤੇ ਸਾਰੂਂ ਨੂੰ ਮਿਲਾ ਦਿੰਦਾ ਹੈ, ਯਾਨੀ ਕਿ div ਨੇ ਦਸਤਾਵੇਜ਼ ਨੂੰ ਅਤਿਰਿਕਤ ਰੂਪਰੇਖਾ ਦਿੱਤੀ ਹੈ। ਨਾਲ ਹੀ, ਇਹ div ਇੱਕ ਜਿਸ ਤਰ੍ਹਾਂ ਦੇ ਅਣੂ ਨੂੰ ਬਣਾਉਂਦੇ ਹਨ, ਇਸ ਲਈ ਇਨ੍ਹਾਂ div ਨੂੰ class="news" ਨਾਲ ਮਾਨਤਾ ਦਿੱਤੀ ਜਾ ਸਕਦੀ ਹੈ, ਇਸ ਤਰ੍ਹਾਂ ਨਾਲ ਨਾ ਕੇਵਲ div ਨੂੰ ਉਚਿਤ ਅਰਥਾਂ ਵਿੱਚ ਵਰਗੀਕ੍ਰਿਤ ਕੀਤਾ ਗਿਆ ਹੈ, ਸਗੋਂ ਇਹ div ਨੂੰ ਹੋਰ ਵਰਤੋਂ ਲਈ ਸਟਾਈਲ ਵਰਤੇ ਜਾਣ ਲਈ ਸੁਵਿਧਾਜਨਕ ਬਣਾਉਂਦਾ ਹੈ, ਇਹ ਇੱਕ ਹੀ ਕਰਕੇ ਦੋ ਕੰਮ ਕਰਦਾ ਹੈ।
ਸੁਝਾਅ:class ਅਤੇ id ਦੇ ਉਪਯੋਗ ਨੂੰ ਵਧੇਰੇ ਸਮਝਣ ਲਈ ਪ੍ਰਸਤਾਵਿਤ ਹੈ ਕਿ ਤੁਸੀਂ 'W3school ਦੇ ਸਰੂਪਾਤਮਕ ਮਾਰਕਅੱਪ' ਦੇ ਪ੍ਰਕਾਸ਼ਨ ਵਿੱਚ 'div, id ਅਤੇ ਹੋਰ ਸਹਾਇਕ' ਦੇ ਅਧਿਆਏ ਨੂੰ ਪੜ੍ਹੋ。
ਸਾਰਵਤਰਿਕ ਅਟਰੀਬਿਊਟ
<div> ਟੈਗ ਇਵੈਂਟ ਅਟਰੀਬਿਊਟ ਦੀ ਸਮਰਥਨ ਕਰਦੇ ਹਨ HTML ਵਿੱਚ ਸਾਰਵਤਰਿਕ ਅਟਰੀਬਿਊਟ.
ਈਵੈਂਟ ਅਟਰੀਬਿਊਟ
<div> ਟੈਗ ਇਵੈਂਟ ਅਟਰੀਬਿਊਟ ਦੀ ਸਮਰਥਨ ਕਰਦੇ ਹਨ HTML ਵਿੱਚ ਈਵੈਂਟ ਅਟਰੀਬਿਊਟ.
ਮਿਆਰੀ CSS ਸੈਟਿੰਗ
ਮਿਆਰੀ ਬਰਾਉਜ਼ਰਾਂ ਵੱਲੋਂ ਹੇਠ ਲਿਖੇ ਮਿਆਰੀ ਮੁੱਲਾਂ ਦੀ ਵਰਤੋਂ ਕੀਤੀ ਜਾਵੇਗੀ <div> ਐਲੀਮੈਂਟ:
div {
display: block;
}
ਬਰਾਉਜ਼ਰ ਸਮਰਥਨ
| ਚਰਾਮਸ | ਐਂਜਲ | ਫਾਇਰਫਾਕਸ | ਸੈਫਾਰੀ | ਓਪੇਰਾ |
|---|---|---|---|---|
| ਚਰਾਮਸ | ਐਂਜਲ | ਫਾਇਰਫਾਕਸ | ਸੈਫਾਰੀ | ਓਪੇਰਾ |
| ਸਮਰਥਨ | ਸਮਰਥਨ | ਸਮਰਥਨ | ਸਮਰਥਨ | ਸਮਰਥਨ |
