30 اردیبهشت 1392
کد خبر : 580

آموزش ساخت یک صفحه ساده با html

یک صفحه ساده html

بنا به درخواست برخی دوستان و مشاهده ورودی های کاربران، در این مقاله قصد داریم یک فایل index.html ساده را بسازیم. توجه داشته باشید این آموزش بسیار مبتدی میباشد و درون آن از هیچگونه کد خاصی(css,js) استفاده نکرده ایم و فقط قصد ما ایجاد یک سند برپایه html میباشد.


جهت ساخت یک صفحهhtml برنامه notepad را باز کنید.(همه ویندوز ها بعد از نصب این برنامه را دارند)(میتوانید عبارت notepad را در run تایپ کنید تا باز شود.

اکنون شروع به اضافه کردن کدها میرسه .

1. باید تعریف کنیم سند ما از نوع htmlمیباشد بدین وسیله در خط اول تایپ میکنیم :

<html>

حالا میخواهیم وقتی سند html رو باز میکنیم حاوی یک عنوان باشه که در کادر محاوری ویندوز قابل مشاهده میباشد.(مانند وب سایت سپهنا که وقتی باز میشه عنوانش تحت : سپهنا | پایگاه تفریحی ایرانیان هست.

برای بعد از کد گفته شده اینتر میزنیم و تایپ میکنیم :

<head>

<title> عنوان صفحه

</title>

با قرار دادن این کد عنوانی را برای صفحه مشخص کردیم . پس عنوان سایت بین تگ <title> و </title> قرار میگیره.

خب حالا باید تگ باز شده <head> را ببنید برای اینکار کافیه </head> را اضافه بکنیم.

پس تا اینجا ما کد های زیر را در notepade قرار داده ایم :

 <html><head><title>عنوان صفحه</titTe></head>

خب تا اینجا هرچیزی که نوشته بودیم درون صفحه قابل مشاهده نبود و به نوعی چهارچوب صفحه ما رو تشکیل میداد.

حالا با تگ زیر میتوانید یک متن را درون صفحه قرار دهیم :

<body></body>

هر چیزی که ما بین 2 تگ بالا قرار بگیرد قابل مشاهده در صفحه وب میباشد.

یادتون هست در ابتدا تگ <html> رو نوشتیم!؟ اکنون در آخر کار خود این تگ را با اضافه کردن یک / میبنیدم.

در نهایت ما قصد داریم متن " به نام خدا " را در صفحه وب نمایش دهیم . کل کدی که باید درون برنامه notepad قرار دهیم میشه :

 <html><head><title>عنوان صفحه</titke></head><body>به نام خدا</body></html> 

اکنون که تمامی کد ها رو نوشتید نوبت به مرحله مهم یعنی خروجی گرفتن از کد ها و قابلیت مشاهده در مرورگر رو پیش رو داریم.

از منوی بالای notepad گزینه file>save as رو کلیک کنید . در کادر محاوره ای باز شده به صورت زیر وارد نمایید .

ساخت یک صفحه ساده

همانطور که میبنید فایل را به نام index.html ذخیره کرده ایم و در کادر پایینی UTF-8 را انتخاب کرده ایم.

توضیح { .html باعث میشه سند ما توسط مرورگر خوانده بشه - UTF-8 هم باعث میشه که صفحه با حروف فارسی مشکلی نداشته باشه.

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

 


وب / سایر مقالات وب sepahna 15 088 بازدید 1 نظر پرینت
  • +5

دیدگاه :

  1. User Avatar
    raziyeh  ـ  در تاریخ : 8/06/1395 - 10:31

    mmnunnnnnnnn


     

دیدگاه خود را ثبت کنید :

نام شما :*
ایمیل شما :
نظر شما :