تگ div
یکی از مهم ترین تگ های HTML باکس ها می باشند.
برای به وجود آوردن یک باکس باید از تگ div که مخفف عبارت division هست استفاده کنیم.
این تگ به صورت بلوکی هست.
یعنی از خط جدیدی شروع می شود و به دیگر تگ ها نمی چسبد.
ساختار تگ div به صورت زیر است :
در مثال زیر کاربرد تگ div را مشاهده می کنید :
<div>
<h2>is paragraph</h2>
<p>html : hyper text markup language</p>
</div>در مثال بالا یک باکس به وجود آورده ایم که چند تگ p زیر مجموعه آن هستند.
برای ساخت یک باکس زیبا می توانید css های زیر را به آن اضافه کنید :
<div style="width: 300px; heigth: 100px; background-color: yellow;">
<h2>is paragraph</h2>
<p>html : hyper text markup language</p>
</div>تگ span
گاهی ممکن است که شما بخواهید یک متن را با استایل مجزا در یک عنصراستفاده کنید.
برای انجام اینکار باید از تگ span استفاده کنید.
تگ span به توسعه دهندگان وب این امکان را می دهد تا یک متن را از سایر متن های یک عنصر مجزا کند.
ساختار تگ span به صورت زیر است :
برای درک بهتر به مثال زیر توجه کنید :
<h1>hello my <span style="color: red;">p</span> tag</h1>در مثال بالا کلمه p با رنگ قرمز نمایش داده شده است.
این کار به کمک تگ span امکان پذیر شده است.
تفاوت تگ های div و span
تفاوت تگ div و span این است که تگ div به صورت بلوک است.
اما تگ span به صورت درون خطی می باشد.
خلاصه درس
- در این بخش با تگ های div و span آشنا شدید.
- همچنین با تفاوت های این دو تگ نیز آشنا شدید.
احسان اسلامی
