files.free-learn.ir · Web viewآموزش کامل ساختار یک فایل HTML Author Sadegh...
7
امل ساختار یک فایل آموزش کHTML 1 متعلق بهین فایل ا فری لرنت آموزشی سای می باشد. آزاد کامومده از آن برای عمستفاشد و ا می با[email protected] https://free-learn.ir / ساختار یک فایلHTML وب یا یک فایلک صفحه یح و شکل و یا ساختار ی طرHTML ر می باشد،ند ساختار و شکل زی بطور کلی همانر می باشد : بصورت زیامی صفحات وبار تم بگیم که ساختنجوریم ایاقع میتونیعنی در و یکیل شده اند، تشت با دستوراندز ساختار کلی همانترنتی ا اینت های سایامیید، تم توجه نمای لطفا به ساختار با شما دستورید توجه نمایترنتی اینت های صفحات سایامیهای تمل اگر به انتی مثاعنی برا ی/< html > ده مشاه را کرد. خواهید که البته نه فقط/< html > ید گرفت کهد خواه جلوتر یاد، کمییده نماینید مشاه را میتواامی ساختار با بلکه تمه کرد. مشاهدنتی را اینتر یا سایتترنتید یک صفحه اینورس که میتوان س چگون<!DOCTYPE html> <html> <head> <title>گرها ورر در م فحه صن عنوا</title> </head> <body> <p>Salam Man Sadegh Hastam.</p> </body> </html>
Transcript of files.free-learn.ir · Web viewآموزش کامل ساختار یک فایل HTML Author Sadegh...
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 1
[email protected]://free-learn.ir/
HTMLساختار یک فایل
بطور کلی همانند ساختار و شکل زیر می باشد،HTMLطرح و شکل و یا ساختار یک صفحه ی وب یا یک فایل یعنی در واقع میتونیم اینجوری بگیم که ساختار تمامی صفحات وب بصورت زیر می باشد :
لطفا به ساختار باال توجه نمایید، تمامی سایت های اینترنتی از ساختار کلی همانند دستورات باال تشکیل شده اند، را مشاهده<html>/یعنی برای مثال اگر به انتهای تمامی صفحات سایت های اینترنتی توجه نمایید شما دستور
خواهید کرد.
بلکه تمامی ساختار باال را میتوانید مشاهده نمایید، کمی جلوتر یاد خواهید گرفت که<html>/که البته نه فقط چگونه میتوان سورس کد یک صفحه اینترنتی یا سایت اینترنتی را مشاهده کرد.
<!DOCTYPE html>
<html>
<head>
<title>
</head>
<body>
<p>Salam Man Sadegh Hastam.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>
</head>
<body>
<p>Salam Man Sadegh Hastam.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>
</head>
<body>
<p>Salam Man Sadegh Hastam.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>
</head>
<body>
<p>Salam Man Sadegh Hastam.</p>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>
</head>
<body>
<p>Salam Man Sadegh Hastam.</p>
</body>
</html>
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 2
[email protected]://free-learn.ir/
خب در ادامه میخواهیم با دستورات موجود در شکل باال آشنا شویم، اینکه این دستورات چه هستند و چکارمیتونن بکنند!؟
دستور توضیح!< DOCTYPE html > می باشد۵یک دستورالعمل که می گوید این صفحه اچ تی ام ال نسخه
< html > ریشه و ستون اصلی یک صفحه اچ تی ام ال< head > هد یا سره یک صفحه اچ تی ام ال که اطالعاتی درباره صفحه به مرورگر ارائه میدهد< title > .با استفاده از این تگ میتوان عنوان صفحه را در مرورگر مشخص کرد
< body > بدنه یا بدن اصلی یک صفحه اچ تی ام الهرچیزی که در این بدن قرار بگیرد در مرورگر نمایش داده می شود
< p > اینو بهش میگیم تگ پاراگراف که یکی از تگ هایHTML.می باشد
اگر دوباره به دستورات باال توجه نمایید، تگی که باز شده است در پایان و با توجه به اولویت باز شدنش بسته شده< بسته شده است.html< اولین تگی است که باز شده و در آخر نیز با >/htmlاست، برای مثال دستور >
باز می شود در صورتی که تگ بسته داشته باشدHTMLپس لطفا همیشه در نظر داشته باشید که هر تگی که در باید بسته شود تا مشکلی برای صفحه وب ما پیش نیاید.
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 3
[email protected]://free-learn.ir/
نحوه نمایش سورس کد یک صفحه وب
کمی باالتر به این اشاره کردم که ساختار یا شکل کلی تمامی صفحات وب همانند دستوراتی می باشد که کمی یکSource codeباالتر با آن آشنا شدید، حال برای اینکه این حرف ثابت شود میخوام نحوه نمایش سورس کد یا
صفحه وب را به شما آموزش دهم تا بتوانید مشاهده نمایید که ساختار کلی تمامی سایت های اینترنتی به چهشکل می باشد.
بفرض مثال میخواهیم ببینیم همین صفحه ای که االن شما در حال مطالعه آن هستید ساختارش به چه شکل می باشد!؟ نه فقط این صفحه و یا سایت آموزشی فری لرن بلکه شما میتوانید در هر صفحه ای از هر سایتی که
بخواهید از طریق روش زیر سورس کد آن صفحه را مشاهده نمایید.
کلیک نمایید تاView Page Sourceلطفا در جای خالی ای از صفحه، کلیک راست نمایید سپس بروی گزینه ی سورس کد آن صفحه در یک تب جدید در مرورگر براتون باز شود.
خب تموم شد! به همین راحتی.. حاال اگه به صفحه ای که براتون باز میشه توجه نمایید میبینید که اول و آخر اون< و دیگر مواردی که در دستورات باال با آنها آشنا شده اید قرار دارد.html< و >/htmlصفحه به ترتیب >
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 4
[email protected]://free-learn.ir/
HTMLتگ ها در
یا برچسب ها، ما با استفاده از تگ ها میتونیم یک محتوا را اعم از متن،تصویر و.. در یک صفحهTagsتگ ها یا بطور کامل آشنا خواهید شد. HTML تگ های وب به نمایش دربیاوریم، در قسمت های بعدی ان شاهللا با
آشنا شویم، شکل کلی یک تگ در یکHTMLولی در اینجا فقط میخواهیم با نحوه نوشتن یا شکل کلی یک تگ در بصورت زیر می باشد:HTMLسند
آنرا می بندیم، حال محتوایعالمت <اول یک عالمت کوچکتری >گذاشته سپس نام تگ را می نویسیم سپس با مورد نظرمون رو وارد میکنیم و در نهایت تگی که در ابتدا باز کردیم میبندیم، برای بستن یک تگ نیز باید اول
عالمت و در نهایت نام تگی که ابتدا باز کردیم را مینویسیم و در پایان هم اسلش / گذاشته سپس کاراکتر عالمت > را میگذاریم.<
برای مثال لطفا به تگ های زیر توجه نمایید :
تگ های تیتر و دو تگ بعدی تگ پاراگراف< معروف به pدر دستورات باال ما سه تگ را میبینیم، اولین تگ، تگ >می باشند، اصال نگران نباشید چون در بخش های بعدی بطور کامل با این تگ ها آشنا خواهید شد.
<TagName>
<p>Salam Khobi?</p>
<h1>Salam Khobi?</h1>
<h2>Salam Khobi?</h2>
<TagName><TagName><TagName><TagName>
<p>Salam Khobi?</p>
<h1>Salam Khobi?</h1>
<h2>Salam Khobi?</h2>
<p>Salam Khobi?</p>
<h1>Salam Khobi?</h1>
<h2>Salam Khobi?</h2>
<p>Salam Khobi?</p>
<h1>Salam Khobi?</h1>
<h2>Salam Khobi?</h2>
<p>Salam Khobi?</p>
<h1>Salam Khobi?</h1>
<h2>Salam Khobi?</h2>
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 5
[email protected]://free-learn.ir/
HTML< در DOCTYPEدستورالعمل >!
که<DOCTYPE>!اگر به دستوراتی که کمی باالتر ارائه دادم توجه کرده باشید ما یک دستور داریم به اسم ماست، وقتی این دستور در ابتدای یکHTML مشخص کننده نوع سند یا صفحه ی HTMLساختار یک فایل در
می باشد.۵ نسخه HTML بیاید یعنی داره به مرورگر میگه که این صفحه HTMLصفحه
بیاید، و بهتر است که همیشه درHTML یعنی قبل از هر تگی در HTMLاین دستور باید در ابتدای یک صفحه تون از این دستور استفاده نمایید. الزم به ذکره که این دستور به حروف بزرگ یا کوچک حساسHTMLصفحات
نیست پس میتونید با حروف کوچک انگلیسی هم بنویسید.
را میتوانید در جدول زیر مشاهده نمایید و همچنین اینکه برای هر یک از نسخه ها از چهHTMLنسخه های زبان استفاده کرد را نیز میتوانید در ادامه مشاهده نمایید.HTMLدستورالعملی باید در ابتدای یک سند
نسخه سالHTML ۱۹۹۱
HTML 2.0 ۱۹۹۵HTML 3.2 ۱۹۹۷
HTML 4.01 ۱۹۹۹XHTML ۲۰۰۰HTML 5 ۲۰۱۴
<!doctype html><!doctype html><!doctype html><!doctype html><!doctype html>
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 6
[email protected]://free-learn.ir/
HTML5 :
>!DOCTYPE html<
HTML 4.01 Strict :
>!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01//EN” “http://www.w3.org/TR/html4/strict.dtd”<
HTML 4.01 Transitional :
>!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “http://www.w3.org/TR/html4/loose.dtd”<
HTML 4.01 Frameset :
>!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Frameset//EN” “http://www.w3.org/TR/html4/frameset.dtd”<
XHTML 1.0 Strict :
>!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”<
XHTML 1.0 Transitional :
>!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”<
XHTML 1.0 Frameset :
>!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Frameset//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd”<
HTMLآموزش کامل ساختار یک فایل
می باشد و استفاده از آن برای عموم کامال آزاد می باشد. سایت آموزشی فری لرناین فایل متعلق به 7
[email protected]://free-learn.ir/
XHTML 1.1 :
>!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.1//EN” “http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd”<
( رسیدیم, در بخش بعدی میخواهیم یادHTMLخب دوستان به پایان بخش ) آموزش کامل ساختار یک فایل را ایجاد نماییم. لطفا در ادامه با من همراه باشید.HTMLبگیریم که چگونه میتونیم یک صفحه یا یک فایل
