logo
logo
تبلیغ کلیکی تاپ سایت 98

همه چیز در مورد تگ div

همه چیز در مورد تگ div
هدایت عباسی آموزش HTML

آموزش ویدیویی تگ div و span

دانلود فیلم و آموزش ویدئویی تگ div و span همراه با مثال. در این آموزش ویدیویی با کاربرد div و span آشنا خواهید شد.

چنانچه مشکلی در اجرای فیلم دارید از مرورگر فایرفاکس استفاده نمایید یا روی لینک زیر کلیک نمایید.

مشاهده یا دانلود فیلم بالا

در این بخش از آموزش html از تاپ سایت 98 به سراغ div می رویم و همه چیز در مورد تگ div در قالب مثال و پروژه html , css یاد می گیریم.

آموزش تگ div در html

در این بخش به سراغ آموزش تگ div در html می رویم. وظیفه div چیست و چه کاربردی دارد؟

تگ div برای بخش بندی و لایه بندی صفحه html و سایت بکار می رود.

در هر پروژه طراحی سایت و قالب ، از تگ div استفاده می شود.

عنصر div در html

عنصر div در html یکی از عناصر و تگ های مهم و کاربردی می باشد. بگذارید با ذکر یک پروژه کوچک توضیح دهیم.

پروژه div با html , css

در پروژه div با html , css که در زیر مشاهده می کنید ما صفحه را به 3 بخش تقسیم کردیم و به هر div یک رنگ دادیم.

بخش header با یک رنگ مشخص شد.

بخش main با یک رنگ مشخص شد.

بخش footer با یک رنگ دیگر مشخص شد.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>TopSite98.com</title>
</head>
<body>
<div id="header" style="background-color: #00BCD4;padding: 20px 0">
<h1>TopSite98.com</h1>
<a href="https://topsite98.com/">تاپ سایت 98</a>
</div>
<div id="main" style="background-color: darkseagreen;padding: 20px 0">
<h2>تاپ سایت 98</h2>
<p>در تاپ سایت 98 آموزش های مختلف کامپیوتر و برنامه نویسی وجود دارد.</p>
</div>
<div id="footer" style="background-color: indianred;padding: 20px 0">
<h1>sh711.com</h1>
<p>آموزش های پروژه محور در سایت شیرازلرن</p>
</div>
</body>
</html>

آموزش div های تو در تو

در پروژه ها و قالب های سایت ها اگر نگاه کنید مشاهده می کنید که از div ها بصورت تو در تو استفاده می کنند.

آموزش کلاس و div

در پروژه ها برای اینکه بتوانند قالب زیبایی طراحی کنند از کلاس ها (class) استفاده زیادی می کنند.

ابتدا یک کلاس به div داده می شود و سپس به آنها استایل داده می شود.

آموزش id و div

از هر id فقط یکبار می توان در هر صفحه استفاده کرد یعنی یک div در صفحه می تواند یک id داشته باشد اما از class می توان برای div های مختلف استفاده کرد.

تگ span در html

برای فهم بهتر تگ span در html بهتر است یک مثال بزنیم.

در مثال زیر ما یک تگ h1 ایجاد کرده ایم من قصد دارم بخش com آن را قرمز کنم برای این کار می توانیم از span استفاده کنیم.

تگ span یک تگ inline است یعنی متن را به خط بعد نمی برد و می توان چند تگ  span را در یک خط قرار داد.

مثال

<h1>TopSite98<span style="color: red">.com</span></h1>

امیدواریم این آموزش برای شما مفید باشد.

موفق باشید.

عزیزانی که تمایل دارند به تیم نویسندگی تاپ سایت 98 بپیوندند می توانند از طریق واتساپ با ما در ارتباط باشند. ما بهترین افراد را به تیم خود اضافه خواهیم کرد.

اگر سوال یا نظری دارید در بخش کامنت ها بنویسید.اگر موضوع خاصی مد نظر شماست که در سایت موجود نیست در بخش کامنت ها بنویسید

دوره ارز دیجیتال تاپ سایت 98

منبع: تاپ سایت 98

تگ:

دوره های آموزشی دوره های آموزشی

نظرات کاربران

از دیدگاه مرتبط با موضوع استفاده نمایید.

از تبلیغ سایت یا شبکه اجتماعی خودداری فرمایید.

برای پاسخ گویی بهتر در سایت ثبت نام نمایید و سپس سوال خود را مطرح فرمایید.