9
یجاد فایل آموزش نحوه اHTML 1 متعلق بهین فایل ا فری لرنت آموزشی سای می باشد. آزاد کامومده از آن برای عمستفاشد و ا می با[email protected] https://free-learn.ir / یجاد فایل آموزش نحوه اHTML ای قدم به قدم زبان از آموزش ه ، در این بخشحترم فری لرن دوستان مHTML یجاد یا ساختیم نحوه ا میخواه یک فایلHTML ساخت صفحها بطور کلی نحوه و یHTML ریم.اد بگی را یک صفحه ی وب ساخت ید نه فقط برایر که میدونی همونطوHTML فایل( از جملهکثر فایل هاد ایجا برای ا بلکه مای صفحات وبی طراح شارپ و.. ، فایل های سی برنامه نویسل های و.. فایB رپوینت آفیس پاو هایPHP,CSS ).. ووص داریم.رهای مخص به نرم افزا نیاز در نتیجهHTML که بتوانیمز دارهر نیا و.. به یک نرم افزاسی یا برنامه نوی طراحی وب وگر زبان های دیند همان هموراتشتن و اجرای دست به نو از طریق آنHTML بپردازیم.وشبختانه خHTML با کمترین خرج ویتونیمست که ما م به گونه ای اعنیین و کم خرج هست، ی یک زبان آفیم. نمایشته و اجرا را نوورات آن دستمکانات اورات وصل باشیم دسترنت اینکه به اینتم یا بدونستفاده کنیرنت ا اینکه از اینتیم بدونقع ما میتونعنی در وا یHTML یم. نمای اجرا)..تر و،کامپیو تاپلپ( یستمماناحت بروی سلی رشته و خی را نویجاد یک فایلشتن و امت برای نو گرون قیرهای نرم افزا و یا حرفه ایلیا خیر خاص ی نرم افزازم نیست از حتیHTML م افزارم چونکه حتی با نرستفاده کنی اNotePad وراتشه به راحتی دست میر ویندوز هم موجود دHTML راشت و اجرا کرد. نو

files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

  • Upload
    others

  • View
    6

  • Download
    0

Embed Size (px)

Citation preview

Page 1: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 1

[email protected]://free-learn.ir/

HTMLآموزش نحوه ایجاد فایل

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

بلکه ما برای ایجاد اکثر فایل ها از جمله )فایلHTMLهمونطور که میدونید نه فقط برای ساخت یک صفحه ی وب و..(PHP,CSSهای آفیس پاورپوینت و.. فایل های برنامه نویسی سی شارپ و.. ، فایل های طراحی صفحات وب

نیاز به نرم افزارهای مخصوص داریم.

هم همانند دیگر زبان های طراحی وب و یا برنامه نویسی و.. به یک نرم افزار نیاز داره که بتوانیمHTMLدر نتیجه بپردازیم.HTMLاز طریق آن به نوشتن و اجرای دستورات

یک زبان آفالین و کم خرج هست، یعنی به گونه ای است که ما میتونیم با کمترین خرج وHTMLخوشبختانه امکانات دستورات آن را نوشته و اجرا نماییم.

یعنی در واقع ما میتونیم بدون اینکه از اینترنت استفاده کنیم یا بدون اینکه به اینترنت وصل باشیم دستوراتHTML.را نوشته و خیلی راحت بروی سیستممان )لپ تاپ،کامپیوتر و..( اجرا نماییم

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

نوشت و اجرا کرد.

Page 2: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 2

[email protected]://free-learn.ir/

HTMLادیتور دستورات

همونطور که میدانید امروزه نرم افزارهای خیلی زیاد و با امکانات فراوانی وجود دارد برای نوشتن دستوراتHTML برای مثال یکی از این نرم افزارها ، Adobe Dreamweaverمی باشد که یکی از بهترین و حرفه ای ترین

می باشد.طراحی صفحات وبنرم افزارهای

ولی خب شاید من دسترسی به همچین نرم افزارهایی نداشته باشم، اونوقت باید چکار کرد؟! همونطور که گفتم خیلی کم خرجه و خیلی راحت ما میتونیم با ساده ترین نرم افزار که در ادامه معرفیHTMLخوشبختانه زبان

را طراحی کرد.HTMLمیکنم یک صفحه

( نرم افزارهای مختلفی به شما پیشنهاد میشهHTMLاگر در اینترنت یک جستجوی ساده بزنید با عنوان )ادیتور ولی بنده در ادامه میخوام یکی از کم خرج ترین و ساده ترین روش رو به شما دوستان محترم پیشنهاد کنم اونم

موجود در سیستمTextEdit موجود در سیستم عامل های ویندوز و یا نرم افزار NotePadاستفاده از نرم افزار ( است.Macعامل های )

استفاده نمایید.Notepad++من پیشنهاد میکنم از نرم افزار کم حجم ولی تاحدودی حرفه ای

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

Page 3: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 3

[email protected]://free-learn.ir/

ویندوزNotepad در نرم افزار HTMLآموزش نحوه ایجاد فایل

Macویندوز را اجرا نمایید و اگر از سیستم عامل NotePadپس لطفا اگر از ویندوز استفاده مینمایید نرم افزار را اجرا نمایید. TextEditاستفاده مینمایید نرم افزار

، چون فعلن ماHTMLبعد از اینکه نرم افزار مورد نظرمون رو را اجرا کردیم، نوبت میرسه به نوشتن دستورات را ببینید لطفا نرمHTML یاد نگرفتیم پس نگران نباشید شما برای اینکه فقط نحوه ایجاد فایل HTMLچیزی از

( نمایید.Paste رو که باز کردید دستورات زیر را در آن کپی و در نهایت پیست )NotePadافزار

(چه بهتر که دستورات زیر رو خودتون با دست خودتون تایپ کنید)

<!DOCTYPE html>

<html>

<head>

<title>

</head>

<body>

<p>آموزش زبان اچ تی ام ال

</body>

</html>

<!DOCTYPE html>

<html>

<head>

<title>

</head>

<body>

<p>آموزش زبان اچ تی ام ال

</body>

</html>

<!DOCTYPE html>

<html>

<head>

<title>

</head>

<body>

<p>آموزش زبان اچ تی ام ال

</body>

</html>

<!DOCTYPE html>

<html>

<head>

<title>

</head>

<body>

<p>آموزش زبان اچ تی ام ال

</body>

</html>

Page 4: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 4

[email protected]://free-learn.ir/

Save asبروی گزینه File از منوی NotePad مون، در نرم افزار HTMLخب حاال نوبت میرسه به ذخیره فایل مون رو مشخص و در نهایتHTMLکلیک نمایید،حال در پنجره ای که باز میشه باید محل ذخیره فایل + نام فایل

کلیک نماییم.Saveبروی گزینه

توجه داشته باشید که باید بصورت دستی پس از نام فایل یک نقطه ).( گذاشته سپس پسوند یا فرمت فایل را به را انتخاب نمایید. UTF-8 باید گزینه Encoding وارد نمایید و همچنین در قسمت htm یا .htmlدو صورت .

Page 5: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 5

[email protected]://free-learn.ir/

می باشد سیستم بطورhtm یا html مون، چون پسوند فایل مون HTMLدر آخرین مرحله میرسیم به اجرای فایل خودکار اونو از طریق یک مرورگر اجرا خواهد کرد ولی اگر برای شما چنین نشد لطفا بروی فایل کلیک راست نموده

یک مرورگر اینترنتی را انتخاب نمایید. Open withسپس در قسمت

Page 6: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 6

[email protected]://free-learn.ir/

++Notepad در نرم افزار HTMLآموزش نحوه ایجاد فایل

در درون نرمhtml میخوام به شما نحوه ایجاد یک فایل HTMLخب دوستان در ادامه ی آموزش نحوه ایجاد فایل پالس پالس را آموزش بدم. لطفا در ادامه و تا پایان با من همراه باشید.notepadافزار

کلیک بروی این لینکابتدا این نرم افزار رایگان را از سایت های معتبر فارسی زبان دانلود نمایید و یا میتوانید با آخرین نسخه این نرم افزار را از سایت رسمی آن دریافت نمایید.

نرم افزار را نصب و سپس اجرا نمایید، وقتی نرم افزار را اجرا میکنید بصورت پیش فرض خودش یک صفحه خالیبه شما نمایش میده و شما فقط باید شروع کنید به کدنویسی زبانی که مدنظرتونه.

ولی خب اگه بخواید یک فایل جدید در این نرم افزار ایجاد نمایید، همانند تصویر زیر بروی شکل مشخص شده کلیک نمایید.Newگزینه بروی File منوی کلیک نمایید، همچنین میتوانید از

حال دستورات مورد نظرتون رو درون این نرم افزار قرار دهید. ) تایپ کنید یا کپی / پیست نمایید ( ، سپس برای برویFileذخیره فایل مورد نظر، همانند تصویر زیر بروی شکل مشخص شده کلیک نمایید، یا میتوانید از منوی

کلیک نمایید.Save As یا Saveگزینه

Page 7: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 7

[email protected]://free-learn.ir/

در پنجره ای که به شما نمایش داده می شود، باید فرمت فایل مون رو مشخص کنیم، یعنی باید مشخص کنیم که نوع فایل را انتخاب نمایید.Save as typeقسمت می باشد، پس همانند تصویر زیر در HTMLاین فایل یک فایل

رو به نام فایل تون اضافهhtmlپسوند .وقتی شما فرمت فایل را انتخاب نمایید بصورت خودکار نرم افزار خودش کلیک نمایید.Saveمیکنه، و دیگه تمام کافیه برای ذخیره نهایی بروی دکمه

Page 8: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 8

[email protected]://free-learn.ir/

نشد، شما بایدindex.htmlاگر پس از انتخاب فرمت فایل ، پسوند فایل مورد نظر نمایش داده نشد ، یعنی اگر نخواهد بود.html را اضافه نمایید در غیراینصورت فایل شما یک فایل htmlبصورت دستی خودتون حتما .

Page 9: files.free-learn.ir€¦  · Web viewآموزش نحوه ایجاد فایل HTML. Author: Sadegh Asadi Created Date: 12/16/2019 02:08:00 Last modified by: Sadegh Asadi Company:

HTMLآموزش نحوه ایجاد فایل

می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 9

[email protected]://free-learn.ir/

++ Notepadنمایش عجیب غریب متن ها در نرم افزار

++ ایجاد کردید، و از متن های فارسی در درون فایل استفادهNotepadاگر پس از اینکه فایل تون رو با نرم افزار کرده اید ولی در خروجی و در مرورگر متن های فارسی شما بصورت ) فونت ناشناس / عجیب / نامشخص (

نمایش داده می شوند باید برای رفع این مشکل از تکه کد زیر استفاده نمایید.

htmlنحوه استفاده از تکه کد باال در یک صفحه:

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

را یاد بگیرید.HTMLهای بعدی همچنان با من همراه باشید تا موارد بیشتری از

<meta charset="UTF-8">

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<meta charset="UTF-8"><meta charset="UTF-8"><meta charset="UTF-8"><meta charset="UTF-8"><meta charset="UTF-8"><meta charset="UTF-8"><meta charset="UTF-8"><meta charset="UTF-8">

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

</head>

<body>