المان های block و inline

اکتبر 16, 2017adminskآموزش htmlبدون دیدگاه

در html المان ها به دو گونه block و inline تقسیم میشوند.

المان های block

المان های block به المان هایی گفته می‌شود که یک سطر را کامل در اختیار می‌گیرند و نمی توان از انها در یک سطر بیش از یک بار استفاده کرد چرا که المان دوم از سطر جدید شروع می‌گردد. در زیر به چند المان block اشاره می‌کنیم:

<div>

<p>

<form>

المان های inline

المان هایی هستند که یک سطر را در اختیار نمی گیرند و در یک سطر می توان آنها را کنار هم قرار داد مانند تگ های زیر:

<span>

<a>

<img>

تگ div:

عمده استفاده از این تگ برای ایجاد بلوک های محتوا در صفحه وب می باشد همچنین به کمک css می توان style های مورد نیاز را به این بلوک ها داد در قطعه کد زیر و خروجی آن به استفاده از تگ div و قرار دادن محتوا در آن پرداخته شده است:

<!DOCTYPE html>
<html>
<body>
<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>
 <p>Standing on the River Thames, London has been a major settlement for two millennia, its history going back to its founding by the Romans, who named it Londinium.</p>
</div>
</body>
</html>

خروجی کد بالا:

تگ span:

عمده استفاده از این تگ برای استایل دهی در متن است به مثال زیر از این تگ توجه نمایید:

<!DOCTYPE html>
<html>
<body>

<h1>My <span style=”color:red”>Important</span> Heading</h1>

</body>
</html>