آموزش HTML – قسمت اول(مقدمه)
سلام
با آموزش های مقدماتی تا پیشرفته HTML در خدمتتون هستیم ، سعی داریم تا بتونیم دوره های آموزشی از مقدماتی تا حرفه ای HTML را در بپرسم داشته باشیم ، خوشحال میشیم اگه شما هم در انتشار مطالب سهیم باشید و هر جایی که ما اشتباه کردیم بهمون بگید 🙂 ، برای ارسال مطالب خود از این صفحه اقدام کنید .
HTML پایه ترین زبان طراحی سایت است و برای اینکه بتونید یک طراح وب سایت موفق بشید باید با تگ های HTML آشنا باشید و بتونید از اونها در صفحات وب سایت به خوبی استفاده کنید .
در یک صفحه HTML می تونیم عکس،ویدئو،صدا،جدول و … قرار بدیم که برای استفاده از هر کدوم از این عناصر باید از تگ های مربوط استفاده کنیم .
آموزش:
- تگ چیست؟
تگ ها برای نشانه گذاری عناصر در صفحه بکار میره ، هر تگی که شروع میشه باید بسته بشه ، مثل:
۱ |
<tagname> ... </tagname> |
- نرم افزار
برای نوشتن کدهای HTML و CSS و در کل برای طراحی سایت نرم افزارهای مختلفی و بسیاری وجود دارد و با هر نرم افزار ویرایشگری میتونید اقدام به نوشتن کدهای HTML , CSS , Js , PHP و.. بکنید ، در این طی این جلسات آموزشی ما با نرم افزار رایگان ، ساده و محبوب NotePad++ کار میکنیم .(لازم نیست که حتما با این نرم افزار کار کنید ، هر نرم افزاری که دوست داشتید میتونید استفاده کنید) .
خب فکر کنم توضیحات دیگه کافی باشه ، بریم سراغ نوشتن اولین صفحه HTML ، کد زیر را در نرم افزار NotePad++ بنویسید و با پسوند html ذخیره کنید :
۱ ۲ ۳ ۴ ۵ ۶ ۷ ۸ ۹ ۱۰ ۱۱ |
<html> <head> <title>Page Title</title> </head> <body> <h1>My First Heading</h1> <p> www.beporsam.ir </p> </body> </html> |
توضیحات:
- <html> </html> : این تگ به مرورگر می فهمونه که این صفحه آغاز یک صفحه HTML است.
- <head> </head> : این بخش برار هدر(سردر) صفحه ما است ، دربین این دو تگ ، تگ هایی قرار میگیره مثل تگ <title> </title> ، که در ادامه بیشتر آشنا خواهید شد .
- <title> </title> : این تگ برای مشخص کردن عنوان صفحه به کار میره ، متنی که بین این دو تگ قرار میگیره عنوامن صفحه را مشخص می کند.
- <body> <body> : این تگ برای محتوای صفحه است ، هر چیزی که بین این دو تگ بنویسیم در صفحه HTML نمایش داده می شود.
- <h1> <h1> : متنی که بین این دو تگ نوشته شود به صورت بزرگ نمایش داده می شود .
- <p> </p> : یک پاراگراف است .
پیش نمایش کد بالا تصویر زیر است :
با ما باشید تا آموزش های بعدی …
موفق باشید .
ارسال نظر
شما باید وارد شوید یا عضو شوید تا بتوانید نظر ارسال کنید