آموزش طراحی وب سایت HTML – درس اول

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

در این مطلب قصد داریم آموزش کامل HTML رو به صورت گام به گام به شما دوستداران کد نویسی آموزش دهیم

قابل توجه دوستداران فیلم آموزشی درس به درس از این آموزش در حال ضبط می باشد و در آینده ای نزدیک در اختیار کاربران قرار خواهیم داد .

برای اجرای تمامی کد ها و نمایش خروجی برای بهتر یاد گرفتن این کد ها میتوانید از سایت ( JSbin ) استفاده کنید

 

برای شروع یک سند از html باید از کد <HTML> استفاده شود و برای بستن این کد از عبارت <HTML/> استفاده شود به عنوان مثال :

برای کپی کردن دابل کلیک کنید

نکته !

برای اینکه فایل شما به زبان html اجرا شود برای دخیره شما بایستی پسوند html را به اخر نام سند خود دخیره کنید

مثال :

ما در اینجا نام سند اچ تی ام ال خودرا به نام farsipsd انتخاب میکنیم پس برای اجرا شدن این سند به صورت اچ تی ام ال پسوند .html به این سند اضافه خواهد شد

حال در انتها نام سند ما به این صورت خواهد در آمد :

farsipsd.html

 

اضافه کردن عناصر در سند html

 

برای اینکه هر عناصری در اچ تی ام ال قابل نمایش و اجرا باشد بایستی از تگ های body و head استفاده شود

 

معرفی تگ های body و head

تگ HEAD : تگ head یا سر یکی از مهمترین بخش های یک سند اچ تی ام ال است به طور کلی یک سند html بخش هد یا سر یا head مغد ان صفحه می باشد .

برای اضافه کردن دستورات CSS به یک صفحه ی وب ما باید دستورات CSS رو در قسمت هِد یا Head یک صفحه ی وب قرار دهیم و دیگر مواردی که در ادامه با آنها آشنا خواهید شد.

همچنین متاداده ها یا metadata نیز در قسمت Head یک صفحه ی وب قرار میگیرند، متاداده ها در HTML در واقع اطلاعاتی را در مورد یک صفحه وب به مرورگرها و موتورهای جستجوگر ارائه می دهند.

عنصر یا تگ <head> در یک صفحه ی وب بعد از تگ <html> و قبل از تگ <body> قرار میگیرد، لطفا به دستورات زیر و محل قرار گیری عنصر یا تگ <head> در یک صفحه ی وب توجه نمایید.

مثال :

 

برای نمایش خروجی این کد از سایت ( https://jsbin.com ) استفاده کنید

برای ثبت تایتل یک سایت از تگ <title> استفاده میشود که این تگ در قسمت سر یا head قرار میگیرد.

به عنوان مثال :

 

با دخیره کردن این سند ، این کد قابل نمایش است

تگ body : تمامی مواردی که ما در یک صفحه وب می بینیم در این تگ قرار میگیرد . مثل : پاراگراف ، رنگ بندی ، جداول و … در ادامه نمونه هایی از این تگ ها را به شما نمایش خواهیم داد .

 

 

Amin-KaizeR

قوانین ارسال دیدگاه

  • دیدگاه های فینگلیش تایید نخواهند شد.
  • دیدگاه های نامرتبط به مطلب تایید نخواهد شد.
  • از درج دیدگاه های تکراری پرهیز نمایید.
دیدگاه‌ها

*
*