برای شروع کار با html نیاز دارید تا مفاهیم اولیه این زبان را یاد بگیرید. ما در این فیلم آموزشی شما را با قوانین ساده ی زبان html و بعضی تگ های (tag) پرکاربرد آن در طراحی صفحات وب آشنا خواهیم کرد.
آنچه در این فیلم آموزشی خواهید آموخت :
- آشنایی با قوانین html و ساختار تگ ها
- تعریف عنصر (المنت) در زبان اچ تی ام ال
- معرفی اصطلاحات تگ بازشونده (opening tag) و تگ بسته شونده (closing tag)
- معرفی تگ های p,br,strong و em و بیان کاربرد آن ها در html
[hdplay id=7]
برای دانلود فیلم آموزشی و اسنیپت های آموزش مربوطه از لینک های زیر استفاده کنید :
[free_vip]
[video_download cat=’html’ url=’http://www.dl.onliner.ir/html-videos/moarefi-moghadamati-tagha-p-br-strong-em.mp4′]دانلود فیلم آموزشی معرفی مفاهیم مقدماتی تگ های HTML[/video_download]
[/free_vip]
دسترسی سریع :
- آموزش قبلی : فیلم آموزشی اچ تی ام ال (html) چیست ؟
- آموزش بعدی : فیلم آموزش ایجاد عنوان (title) برای صفحات وب
- لیست فیلم ها : فیلم های آموزش جامع HTML
متن فیلم آموزشی معرفی مفاهیم مقدماتی تگ های HTML
آشنایی با تگ
ما می توانیم به وسیله تگ ها صفحه وب خود را نشانه گزاری کنیم. بیشتر تگ ها یک تگ شروع و پایان دارد.
ساختاربیشتر تگ ها به صورت زیر است :
[html]
< openning tag>محتوا</closing tag>
[/html]
تگ p
[html]
<p>پاراگراف شما</p>
[/html]
تگ br
جز تگ های خاص به حساب می آید که تگ شروع ندارد و با تگ های دیگر تفاوت دارد. تگ br برای شکستن متن و هدایت شدن به خط بعدی می شود.
ساختار تگ br در تگ p :
[html]
<p>your <br />paragraph </p>
[/html]
تگ br باعث شکستن متن و هدایت شدن به خط بعدی می می شود یعنی your در خط اول و paragraph در خط دوم به نمایش در می آید :
نکته :
- تگ br باعث شکستن متن و رفتن به خط دیگر می شود اما هنوز یک پاراگراف محسوب می شود.
- در html کلید enter برای خط بعدی استفاده نمی شود و با enter زدن هیچ تغیری در نمایش متن صورت نمی گیرد.
- در html کلید space باعث یک فاصله می شود و چندین بار space زدن هم تفاوتی با یک space ندارد.
تگ strong
مانند تگ p یک تگ شروع و یک تگ پایان دارد. تگ strong برای تاکید کلمه یا جمله استفاده می شود .
توجه کنید تگ strong برای تاکید است و برای bold سازی کلمات یا جملات باید حتما از css استفاده کنیم.
ساختار تگ strong در تگ p :
[html]
<p>your <strong>paragraph</strong> </p>
[/html]
تگ em
مانند تگ p یک تگ شروع و یک تگ پایان دارد. تگ em برای italic سازی کلمه یا جمله استفاده می شود.
[html]
<p>your <em>paragraph</em> </p>
[/html]
تگ em باعث می شود کلمه paragraph به صورت italic نوشته شود.
استفاده تگ ها به صورت تو در تو
برای استفاده از تگ ها تو در تو از ساختار زیر استفاده می کنیم
به عنوان مثال:
میخواهیم روی کلمه onliner :
در یک پاراگراف قرار دهیم.
و خاصیت italic , bold را داشته باشد.
[html]
<p><strong><em>onliner</em></strong></p>
[/html]
نتیجه :
توجه کنید هر تگی که دیرتر بیاید، زودتر بسته میشود، مثل قاعده پرانتزها در عبارات ریاضی. به عنوان مثال :
ابتدا تگ em بسته می شود و بعد تگ های بعدی.
مثال2:
[html]
<p>Hello dear onliner.ir users</p>
<p>Hello <em>dear onliner.ir users</em><br />,welcome to <strong>video</strong> tutorials</p>
<p>Hello dear onliner.ir users</p>
[/html]
دسترسی سریع :
- آموزش قبلی : فیلم آموزشی اچ تی ام ال (html) چیست ؟
- آموزش بعدی : فیلم آموزش ایجاد عنوان (title) برای صفحات وب
- لیست فیلم ها : فیلم های آموزش جامع HTML