keyboard_return  چسبون مقالات آموزشی آموزش گام به گام html از مبتدی تا پیشرفته
  1. آموزش گام به گام html از مبتدی تا پیشرفته

آموزش قدم به قدم html از مبتدی تا پیشرفته

در این سری قصد داریم به صورت قدم به قدم HTML رو به شما آموزش بدیم.

با html شما میتونید صفحات وب رو بسازید. زبان html خیلی آسون و قابل درک هست و شما از این زبان لذت میبرید.

در این قسمت یک مثال کاربردی از html برای شما میزنیم:

<html>
<head>
<title>Page Title</title>
</head>
<body>

<h1>سلام چسبون</h1>
<p>آموزش برنامه نویسی با چسبون</p>

</body>
</html>

نکته ها :

  • به علامت های <> (بزرگتر یا کوچکتر در ریاضیات) در html تگ گفته می شود.
  • برای شروع برنامه نویسی html از تگ <html> ، و برای بستن تگ از <html/> استفاده می کنیم.
  • تگ <title> همیشه درون تگ <head> قرار می گیرد.
  • وظیفه تگ <title> نمایش توضیحات بر روی تب مرورگر است. هرچه درون تگ <title> بنویسید در تب مرورگر نمایش خواهد داد.
  • بدنه ی اصلی سایتمان را درون تگ <body> ایجاد می کنیم.
  • تگ <h1> یک تیتر بزرگ ایجاد می کند.
  • تگ <p> یک پاراگراف ایجاد می کند.

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

محتویات مثال بالا را در فایل paste کرده و سپس save کنید.

حالا بر روی فایل دوبار کلیک کنید تا حاصل رو ببینید. تبریک شما اولین کد html رو نوشتید!

آموزش گام به گام html از مبتدی تا پیشرفته - 4.2 از 5 بر اساس 150 رای

امتیاز کاربران

آموزش گام به گام html از مبتدی تا پیشرفته
دیدگاه‌ها
NF NF 2 ماه پیش
سلام خسته نباشید. چرا تو مثالها تگ head بعد از html وجود نداره و فقط body هست؟
آرمان بابائی آرمان بابائی 2 ماه پیش
چون تگ meta اختیاری هست. الزامی وجود نداره باشه یا نباشه. در آموزش برای اینکه مثال‌ها خواناتر باشن نذاشتیم تگ meta رو.
great arash great arash 3 ماه پیش
یه خسته نباشید میگم برا همچین دوره خوبی. بشدت کارمو راه انداخت و قابل هضم بود
آرمان بابائی آرمان بابائی 3 ماه پیش
ممنونم دوست عزیز.
POOYA POOYA 5 ماه پیش
عالی
ماهان ماهان 8 ماه پیش
ببخشید من میخوام زبان اچ دی ام ال رو یاد بگیرم . باید از چه برنامه ای استفاده کنم
آرمان بابائی آرمان بابائی 8 ماه پیش
سلام وقت بخیر. خدمت شما عرض شود از همین آموزش به صورت گام به گام مراحل توضیح داده شده و میتونید یاد بگیرید کامل.
رادین رادین 9 ماه پیش
سلام می خواستم بپرسم که شما می تونید برای من برنامه نویسیش انجام بدید میخوام وب سایت خدمات و فروشگاه بزنم من هم پولش رو بهتون میدم؟
مهندس ضمامی مهندس ضمامی 9 ماه پیش
سلام، بله ، براتون انجام میدیم
احمد احمد 11 ماه پیش
سلام من مثلامیخوام توی یه تگم هم رنگش عوض بشه هم سایز اما نمیشه لطفاً راهنمایی کنید مثال: <p style="font-size: 17pt;" style="color: blue;"></p>
آرمان بابائی آرمان بابائی 11 ماه پیش
لطفاً اینگونه سوالات رو در قسمت بپرس سایت بیان کنید. کد شما دوتا stryle داره که اشتباست. همه‌ی استایل‌ها رو در یک style بنویسید.
محمد محمد 1 سال پیش
سلام من مثلا اگر کد نویسی هارا کرده باشم چگونه به یک سایت عمومی تبدیل کنم مثال سایتم را به hajghasemsolamani.com تبدیل کنم یا hajghasem.htmlلطفا جواب دهید
آرمان بابائی آرمان بابائی 1 سال پیش
منظورتون رو متوجه نشدم! اگه منظور شما اینه سایت رو بارگذاری کنید،باید با یک شرکت هاستینگ تماس بگیرید تا راهنمایی کنن شمارو.
مهشید مهشید 1 سال پیش
سلام فک میکنم منظورشون اینه که چرا ادرس نداره و ادرس خود سیستم میاد اون بالا . سوال خودمم هست
مهشید مهشید 1 سال پیش
سلام ممنون عالی بود . فقط اگه بخوام این متن تیتر است بیاد وسط باید چه کدی بزنم ؟
آرمان بابائی آرمان بابائی 1 سال پیش
سلام. همچین راهی وجود نداره و خود مرورگر این مورد رو انجام می‌ده.
sona sona 1 سال پیش
تشکر بخاطر آموزش عالیتون
آرمان بابائی آرمان بابائی 1 سال پیش
خوشحالیم که راضی بودید. امیدواریم از آموزش‌های دیگه هم دیدن کنید.
M.a.s.b M.a.s.b 2 سال پیش
سلام و خسته نباشید ایاگذاشتن تصویر در کد نویسیست
آرمان بابائی آرمان بابائی 2 سال پیش
متوجه سوال شما نشدم!
Nilougar Nilougar 1 سال پیش
من میخوام یه پروژ کامل درست کنم چه جوری میشه
آرمان بابائی آرمان بابائی 1 سال پیش
چه پروژه ای مد نظرتونه؟ باید بگید تا بهتر بشه کمکتون کرد.
sajaf sajaf 1 سال پیش
با عرض سلام میخواستم بدونم من چیز زیادی از طراحی وب نمی دونم اگر این موضوعات شما رو پیگیر بشم میتونم یک سایت خوب درست کنم و درآمد طراحی وب چقدره اگه سوالات را جواب بدین ممنون میشم
آرمان بابائی آرمان بابائی 1 سال پیش
سلام و عرض ادب. لطفا سوالاتتون که مرتبط با این پست نمیشه رو در قسمت بپرس سایت بیان کنید.
مهرداد اشتری مهرداد اشتری 2 سال پیش
آموزش خیلی خوبیه. لطفا بفرمایید برای راست چین کردن جدول یا عکس باید چکار کنیم. ممنونم.
آرمان بابائی آرمان بابائی 2 سال پیش
ممنون از فیدبک شما. اگر سوالی دارید در قسمت پرسش پاسخ سایت بفرمایید.
Joker Joker 2 سال پیش
سلام من می خواستم درگاه بسازم با html چطوری بسازم
آرمان بابائی آرمان بابائی 2 سال پیش
برای ایجاد درگاه پرداخت نیاز به یک زبان سمت سرور دارید.
parsa parsa 2 سال پیش
سلام اقا ارمان. ببخشید شما نمیتونید یک کد نویسی جامع از تمام مطالب html بگذارید
آرمان بابائی آرمان بابائی 2 سال پیش
منظورتون از کدنویسی جامع رو متوجه نشدم. سعی شده در این آموزش گام به گام به اکثر موارد اشاره بشه.
parsa parsa 2 سال پیش
اقا ارمان خودتون همه این سایت رو نوشتین یا یک سیستم طراحی کردید که حودش خودکار بنویسه اخه خیلی زیاد و ادم بخواد طراحی کنه سزش باید خلوت باشه خیلی میشه توضیح دهید.... ممنون
آرمان بابائی آرمان بابائی 2 سال پیش
درود. بله خودم کامل سیستم رو نوشتم و پیاده سازی کردم. خب هر پروژه ای زمان زیادی صرف میشه براش و هرچی تجربه شما بالاتر باشه زمان کمتری می‌گذارید برای پروژه.
PARSA PARSA 2 سال پیش
یعنی من چهارده ساله هم مفاهیم رو درک می کنم واقعا بیستید (خیلی مختصر)
آرمان بابائی آرمان بابائی 2 سال پیش
درود بر شما. امیدواریم بتونیم باعث پیشرفت شما بشیم. سپاس از نظر شما.
حمیده حمیده 2 سال پیش
سلام،وقتتون بخیر،سایت بسیار پرمحتوا و عالی ای دارید. من متوجه تگ <blockqoute> نشدم،چرا در این تگ آدرس سایت قرار دادید؟
آرمان بابائی آرمان بابائی 2 سال پیش
درود بر شما. خاصیت cite در این تگ منبع نقل قول هست. منبع این نقل قول هم سایت چسبون هست. موفق باشید.
خشایار خشایار 2 سال پیش
میخوام از تجربه شخصیم در مورد این اموزش بگم:حدودا یک هفته پیش شروع کردم به اموزش و با روزی دو تا سه ساعت تمرین میشه گفت یاد گرفتم باید یک سری نکات گفته می شد که نگفتن و شاید بخاطر اینه که خودتون برید دنبالش و بفهمید.... درکل اموزش خوبی هست و من راضی بودم ممنونم از جناب بابانی و دستاندر کاران سایت
خشایار خشایار 2 سال پیش
سلام خسته نباشید میخواستم بدونم این موارد برای یاد گیری کامل html5 کافی هستند؟ یعنی اگر بنده این اموزش رو شروع کنم به طور کامل html5 رو یاد میگیرم؟
آرمان بابائی آرمان بابائی 2 سال پیش
درود. بله این آموزش ها کافیه و اینکه حتما باید تمرین زیادی داشته باشین تا خوب یاد بگیرین
فرید فرید 2 سال پیش
سلام کانال تلگرامی ندارید من میخواستم تازه شروع کنم باید چی کار کنم هیچ چیزی بلد نیستم الان و نمیدونم باید از کجا شروع کنم
آرمان بابائی آرمان بابائی 2 سال پیش
سلام. کانال تلگرام لینکش در فوتر سایت هست.
Mostafa  Mostafa 2 سال پیش
واقعا دستمریزاد. دستمریزاد به این حُسن نیت و شکوه. لذت بردم از اموزشتون. کامل و جامع و مرتب.
آرمان بابائی آرمان بابائی 2 سال پیش
سپاس. فیدبک شما بهمون دلگرمی میده.
Sepehr  Sepehr 2 سال پیش
سلام من سایت های زیادی رو گشتم. همه جا یه طوری آموزش میداد که برای افراد مبتدی قابل فهم نبود ولی سایت شما خیلی عالیه ساده و قابل فهم سپاسگزارم
آرمان بابائی آرمان بابائی 2 سال پیش
سپاس بابت فیدبک انرژی بخش شما.
ژینوس ژینوس 2 سال پیش
سلام.ممنون بابت آموزش وقتی در مرحله 4 فایل را باز میکنم، به صورتی که در تصویر گفتید نشون داده نمیشه. همان فایل notepad با متنی که توش تایپ کردم باز میشه . دقیقا مثل تصویر مرحله 2. میشه راهنماییم کنید؟ سپاس گزارم.
آرمان بابائی آرمان بابائی 2 سال پیش
قسمت 4 آموزش که تصویری نداره! اما فکر کنم مشکل شما این باشه پسوند فایل رو به html تغییر نمی‌دید.
نفس نفس 2 سال پیش
ممنون از پاسخ گویی سریعتون چرا.تغییر میدم تمام مراحل کار را طبق آموزش انجام دادم چرا به این شکل دیده میشه؟ به همان شکلی که تایپ کردم در نوتپد ، دیده میشه . درواقع همون پنجره نوت پد باز میشه
آرمان بابائی آرمان بابائی 2 سال پیش
کدوم قسمت آموزش رو منظورتونه؟ شماره آموزش رو بفرمایید.
sh_pro sh_pro 3 سال پیش
سلام , من همین کارو میکنم اما موقع سیو کردن یه ارور برام میاد و زمانی که اونو اوکی میکنم و وارد سایت میشم فقط علامت ؟؟؟؟؟؟؟؟؟ میبینم بجای تکست هام , اگه میشه لطفا راهنمایی کنید
آرمان بابائی آرمان بابائی 3 سال پیش
سلام نگفتید دقیقا چیکار میکنید! ولی فکر کنم برای encoding باشه. وقتی خواستید فایل رو ذخیره کنید بر روی save as کلیک کنید و در پنجره باز شده Encoding رو بر روی UTF-8 تنظیم کنید و بعد بر روی Save کلیک کنید تا مشکل شما حل بشه.
علیرضا علیرضا 3 سال پیش
سلام. چسباندن یه کد اچ تی ام ال در ساین www.mix.com به چه صورت است ?ممنون میشم اگه توضیح بدید بهم
آرمان بابائی آرمان بابائی 3 سال پیش
سلام با این سایت کار نکردم اما اگه بهتون در خروجی کد html میده می تونید کد رو ذخیره کنید و بعد ویرایش کنید و کد خودتون رو بچسبونید اونجا. و نیاز نیست حتما در اون سایت اینکار رو انجام بدید!
Mohammad Mohammad 3 سال پیش
سلام ممنون از آموزش خوبتون میخواستم بدون آموزش PHP تو آموزشها دارین با تشکر
آرمان بابائی آرمان بابائی 3 سال پیش
با سلام. آموزش php رو در دوره ویدویی آموزش میدم.
h.malek h.malek 3 سال پیش
سلام صفحه تست آنلاین بسیار عالی و کاربردی است خیلی بدردم خورد. ممنون از زحمات شما
کیمیا کیمیا 3 سال پیش
عالی تر از سایت شما پیدا نمیشه. آموزش ساده و روان همراه با تست آنلاین.بی نظیره
آرمان بابائی آرمان بابائی 3 سال پیش
خوشحالیم باعث رضایت شما هستیم.
Maryam Maryam 4 سال پیش
درموردخاصیت زبان (lang) میشه بیشتر توضیح بدین؟
آرمان بابائی آرمان بابائی 4 سال پیش
صفت lang زبان یک سند HTML رو مشخص می کنه.اگر بخواهیم کاراکترها به درستی نمایش داده شوند باید از متا تگ utf-8 استفاده کرد.
 reza reza 2 سال پیش
سلام ببخشید بقیه درس های اچ تی ام ال در کجا قرار داره
آرمان بابائی آرمان بابائی 2 سال پیش
درود. درس‌های html همین‌هایی هست که می‌بینید. دنبال چه چزی هستید ؟

2021 © Copyright کليه حقوق مادی و معنوی براي چسبون محفوظ است و هرگونه کپی برداری پیگرد قانونی دارد.