معرفی تگ های کاربردی HTML

  1. خانه
  2. chevron_right
  3. آموزش
  4. chevron_right
  5. معرفی تگ های کاربردی HTML

تگ های کاربردی HTML

آموزش تگ های HTML میخواهیم بصورت عملی کار رو شروع کنیم و یه یک پروژه ی واقعی رو استارت بزنیم و درباره‌ی تگ ها در HTML بصورت کامل صحبت کنیم.برای شروع کار با html ابتدا وارد notepadمیشویم و با پسوند.html ذخیره میکنیم

تگ <a> :

بعد از تگ div ، یکی از کاربردی ترینََ تگ های html تگ a یا همان لینک است. با استفاده از این تگ می توانیم در سایتمان لینک ایجاد کنیم ، منوی های لینک دار ، تصاویر لینک دار ، دکمه های دانلود و… همه از تگ a استفاده می کنند.

نکته : تگ لینک یا همان a ، یک تگ inline است. یعنی اگر چند تگ a را زیر همدیگر بنویسیم ، آنها را در کنار هم نمایش می دهد.

تگ <ul>

برای ساخت منو از این تگ استفاده می کنیم. اکثر منوهای سایت ها با این تگ ساخته میشود.

<ul>

<li/>شماره یک<li>

<li/>شماره دو<li>

<li/>شماره سه<li>

</ul>

تگ های عنوان :

<h1/>عنوان1<h1>

<h2/> عنوان2<h2>

<h3/> عنوان3<h3>

<h4/> عنوان4<h4>

تگ عنوان

 

تگ table:

برای ساختن جدول در htmlبه کار میرود وبین دو تگ باز<html>و تگ بسته <html/> نوشته میشود

تگ <div> :

این تگ یکی از مهم ترین و کاربردی ترین تگ های HTML است. به وسلیه این تگ می توانیم صفحه ی سایتمان را قسمت بندی کنیم و در هر کدام از این قسمت ها ، محتوایی را که دوست داریم قرار بدهیم. این تگ به دو صورت خوانده میشود.

مقالات پیشنهادی کاربران
طراحی سایت

1- دیو

2- دی آی وی

به خودتان بستگی دارد که چه مدلی بخوانیدش! من مدل دوم را ترجیح میدهم!

تگ <p> :

می رسیم به تگ دوست داشتنی p ! با استفاده از این تگ می توانیم پاراگراف ها را به سایتمان اضافه کنیم. بخش عمده ای از هر پست سایت از پاراگراف ها تشکیل شده است. اگر با مرورگرتان از همین متن inspect بگیرید ، متوجه این موضوع میشوید.

اتربیوت های تگ img :

src : در این اتربیوت آدرس عکسمان قرار می گیرد.

alt : این اتربیوت یک متن جایگزین برای عکسمان در نظر میگیرد تا اگر عکسمان به هر دلیلی لود نشد ، آن متن نمایش داده شود.

احتمالا یک بار اتفاق افتاده است که با چنین سایتی مواجه شده باشید. راستی حتما alt را قرار دهید. حتی اگر شده به صورت خالی چون برای سئو مهم است.

title : این اتربیوت عنوان عکس را نمایش میدهد. به عبارتی وقتی موس را روی عکس ببرید title نمایش داده میشود.

width : عرض تصویر را مشخص میکند.

height : ارتفاع تصویر را مشخص میکند.

در نهایت یک تگ img کامل به این صورت در می آید :

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

این فیلد را پر کنید
این فیلد را پر کنید
لطفاً یک نشانی ایمیل معتبر بنویسید.

فهرست