آموزش ساخت فایل HTML
فرقی نمیکنه که از چه مرورگری برای جست جو در دنیای اینترنت استفاده میکنید،مهم این است که مطلب مورد نیاز خود را پیدا کنید.هر یک از صفحاتی که در مرورگر خود مشاهده میکنید یک نوع سند HTML محسوب میشود. ما در این مقاله برای شما عزیزان نحوه ایجاد فایل html را برای شما تهیه کرده ایم .
آنچه در این مقاله خواهید آموخت:
( Hyper Text Markup Language ) یک زبان نشانه گذاری و مخصوص صفحات وب است که در دنیای اینترنت بارگذاری میشود،که میتوان پاراگراف،عناوین،تصاویر،ویدئو و دیگر عنصرها (Element) که میتوانید در یک صفحه تولید و بازگذاری کنید.
نکته : تگ های HTML برای ساخت عنصر (Element)به کار میروند. و استایل دهی مانند:جابجایی در صفحه،تغییر رنگ و فونت باید از دستورات Cascading Style Sheets) CSS) استفاده کرد.
تگ ها در HTML به دو بخش تقسیم میشود:
در تگ های باز از <> استفاده میشود و در تگ های بسته یک Slash به ابتدای تگ اضافه میشود </> که انتهای تگ را مشخص میکند،لازم به ذکر است که تمامی تگ های HTML از قانون یک تگ باز و بسته پیروی نمیکنند و یک سری از تگ ها تنها یک تگ دارند یا همان تگ باز محسوب میشوند به مثال های زیر توجه کنید:
<p> .این یک پاراگراف است </p>منظور از تگ <p> برای ایجاد یک پاراگراف است و به یک تگ باز و بسته منتهی میشود.
<img src="itvisit_image.jpg" width = "300" height="400" alt="Image Itvisit">از تگ <img> جهت چسباندن تصویر استفاده شده که تنها از یک تگ پیروی میکند و نیازی به تگ بسته نیست این نوع از تگ ها نیز در این زبان پر استفاده و پر کاربرد میباشند.
<doctype html!>: این تگ در ابتدای سند نوشته میشود و به مرورگر نشان میدهد از چه نسخه ای استفاده میشود و تنها یک تگ باز محسوب میشود.
<html>: جز تگ بالا تمامی تگ ها زیر مجوعه این تگ شمرده میشوند، به نوعی مادر بقیه تگها به شمار می آیند و به یک تگ باز و بسته منتهی میشود.
<head>: این تگ زیر مجموعه تگ بالاست و یک تگ باز و بسته است. مانند یک هسته اصلی عمل میکند و تمامی تنظیمات یک فایل را درون خود جای میدهد، مانند عنوان برگه و متصل کردن فایل های بیرونی مانند دستورات CSS یا کد های Javascript و دیگر دستوراتی که میتوان به برگه ساخته شده اضافه کرد و تنظیمات خاص خود را در این بخش اعمال نمود.
<body>:این تگ متشکل از یک تگ باز و بسته است که زیر شاخه تگ مادر یا همان تگ <html> به شمار می آید که تمامی عنصر ها (Element) مانند:جداول،فرم ها،تیتر،پاراگراف و دیگر امکاناتی که میتوان در صفحه ساخت را در خود جای میدهد و قابل مشاهده خواهند بود.
در تصویر زیر مشاهده میکنید که نوع چینش تگهای اصلی به چه گونه است.
زمانی که میخواهید فایل را در مروگر اجرا کنید ممکن هنگام اجرا با متن های عجیب و نانشناس مواجع شوید.
برای رفع این مشکل میتوان از تکه کد زیر که در بخش head نوشته میشود و این خطا بدون هیچ مشکلی رفع خواهد شد.
<meta charset="utf-8">دستور بالا یک متاتگ است که یکی از پر کاربردترین متاتگ ها به شمار میرود که زبان فارسی را بدون هیچ مشکلی و به طور صحیح در مروگر نمایش میدهد.
نکته:تگ <title> که شامل یک تگ باز و بسته است عنوان سند ایجاد شده را مشخص میکند و در بخش head قرار میگیرد.
در تمامی نرم افزار های مانند ورد،اکسل،پاورپوینت و یا زبان های برنامه نویسی مثل پایتون، جاوا و غیره هر فایل که ایجاد میشود یک یا چند پسوند به خود اختصاص میدهد که موقع اجرا در برنامه مورد نظر بدون مشکل شناسایی و نمایش داده شود.
برای نمایش پسوند فایل ها در ویندوز 7 و ویندوز 10 مراحل زیر را انجام دهید:
نکته : در ویندوز 10 بجای organize از زبانه view و سپس دکمه option استفاده کنید .
فایل های HTML از دو پسوند html و htm پشتیبانی میکند این دو پسوند هیچ تفاوتی با یک دیگر ندارند و میتوان از هر دو استفاده کرد.
برای ساخت یک فایل HTML تنها یک مرورگر و نوت پد کافیست.
سپس فایل ساخته شده را در مرورگر باز کنید.
سند ایجاد شده که یک فایل خام است را مشاهده خواهید کرد، ما برای خالی نبودن سند ایجاد شده چندین عنصر به آن اضافه کرده ایم .
در این مقاله آموختید آموزش ساخت فایل HTML با یک نوت پد ساده و مرورگر.
بازگشت به صفحه اصلی
در این مطلب به آموزش ساخت Jumping Text در صفحه پرداخته ایم: پرش در متن به چه معناست: تگ h1…
توابع (Functions) یکی از مهم‌ترین اجزای هر زبان برنامه‌نویسی هستند و PHP نیز از این قاعده مستثنی نیست. توابع در…
در PHP، دستور echo برای نمایش رشته‌ها در مرورگر استفاده میشود. اما وقتی از کاراکترهای کنترلی \n برای رفتن به…
در طراحی سایت، یکی از عوامل مهمی که می‌تواند تجربه کاربری را بهبود بخشد، استفاده از فرمت مناسب فونت است.…
کاراکترهای کنترلی در PHP به کاراکترهایی اشاره دارند که برای کنترل نحوه نمایش یا پردازش متن استفاده میشوند. این کاراکترها…
یکی از امکانات مهم در برنامه هلو، مدیریت پرداخت چک‌ها است که می‌تواند برای کنترل تراکنش‌های مالی و تنظیم پرداخت‌های…