جستجو برای:
  • دوره ها
    • حساب کاربری
    • سبد خرید
  • مقالات
 
نارنجک
0

ورود و ثبت نام

دسته بندی‌ دوره‌ها
  • صفحه اصلی
  • دوره ها
    • دوره مقدماتی HTMLCSS
    • دوره پروژه محور php
    • دوره مقدماتی برنامه نویسی
    • دوره پروژه محور طراحی سایت
  • مقالات
    • آموزش پی اچ پی
    • آموزش لاراول
    • آموزش جاوا اسکریپت
    • آموزش HTML
    • آموزش CSS
    • آموزش وردپرس

وبلاگ

نارنجک مقالات کل دسته بندی ها آموزش html html چیست ؟

html چیست ؟

۱۳۹۹/۰۶/۲۰
ارسال شده توسط سالار حقیقت نیا
آموزش html ، آموزش‌های رایگان
468 بازدید
html چیست

در این مقاله از سری مقالات آموزشی سایت نارنجک با هم بررسی می‌کنیم html چیست.

فهرست محتوا پنهان
1 تگ چیست ؟
1.1 تگ باز:
1.2 تگ بسته:
1.2.1 ساخت صحیح یک صفحه ی وب
1.3 تگ head:
1.4 تگ body:
1.4.1 ساخت اولین صفحه وب

کلمه html مخفف شده ی عبارت Hyper Text Markup Language که معنیش میشه زبان نشانه گذاری ابر متن که از این زبان برای ساخت صفحات وب یا وب سایت ها استفاده میشه.

تگ چیست ؟

در زبان html برای نمایش دادن هر چیزی در صفحه وب مثل عکس، فیلم، متن، صدا و … از تگ استفاده میشه که ساختار این تگ به دو صورت زیره:

  • تگ باز 
  • تگ بسته

تگ باز:

شکل تگ های باز به صورته، < اسم تگ > درواقع ما اسم تگ رو بین علامت <> (کوچکتر و بزرگتر) میزاریم.

تگ بسته:

شکل تگ های بسته به صورته، < اسم تگ /> درواقع ما اسم تگ رو بین علامت </> (کوچکتر، اِسلش و بزرگتر) میزاریم که تنها فرقش با تگ باز داشتن یک / قبل از اسم تگ هست.

برای نمایش دادن هر عنصر در وب سایت ها اون رو بین تگ باز و تگ بسته قرار میدیم برای مثال برای نمایش دادن آدرس در وب سایت ها آدرس مورد نظر رو به صورت زیر مینویسیم :

<address> تهران خیابان ولیعصر کوچه سوم پلاک ۱۴۲ </address>

یا برای نمایش دادن پاراگراف در صفحه وب، ماننده مثال زیر متن را بین تگ باز و بسته ی p قرار می دهیم.

<p> این یک پاراگراف است </p>

ساخت صحیح یک صفحه ی وب

برای ساختن صحیح یک صفحه ی وب تمامی تگ ها باید بین تگ باز و بسته Html قرار بگیرد.

<html>
    تگ ها رو اینجا می نویسیم 
</html>

خود تگ html فقط دو تگ فرزند داره به اسم head (سر) و body (بدنه) و هر تگ دیگه ای رو ما بین تگ head یا body می نویسیم.

<html>

    <head> 

    </head>
    
    <body> 

    </body>

</html>

تگ head:

همونطور که از اسمش معلومه این تگ سَره سایته و کاری با بدنه سایت نداره در واقع تگ هایی که برای نوشتن ما بین تگ head تعریف شدن چیزی رو توی بدنه سایت به نمایش نمیزارن و فقط مربوط به اطلاعات و تنظیمات سایت هستن چنتا مثال برات این پایین گذاشتم

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

<html>
 
    <head>
        <title>نارنجک - آموزش برنامه نویسی </title>
    </head>

     <body>
 
    </body> 

</html>

تگ body:

این تگ همونطور که از اسمش معلومه بدنه ی سایته و هرچیزی که بین تگ بادی بنویسی توی سایت نمایش داده میشه مثالی که بالا تر برای آدرس و پاراگراف زدم رو میتونی این پایین ببینی.

<html>

    <head> 
        <title>نارنجک - آموزش برنامه نویسی </title>
    </head> 

    <body>
        <address> تهران خیابان ولیعصر کوچه سهرابی پلاک ۶۴ </address>

        <p> این یک پاراگراف است </p>                
    </body>

</html>

 

ساخت اولین صفحه وب

خب حالا بریم با هم اولین صفحه وب رو بسازیم روی صفحه دسکتاپ کلیک راست کن و از قسمت New گزینه Text Document رو انتخاب کن و حالا تو یک فایل تکست ساختی.

 

حالا مثل من اسم و پسوند فایل رو عوض کن بزار index.html دقت کن پسوندش رو از .txt به .html تغییر دادم.

index.html

 

قطعا الان داشتن یک کد ادیتور خفن خیلی بت کمک میکنه اما حالا که نداریم روش کلیک راست کن و از قسمت open with گزینه ی notpad رو انتخاب کن اگه نبود گزینه اخر choose another app رو بزن و از اونجا انتخابش کن.

notpad

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

<html> 

    <head>
        <title>نارنجک - آموزش برنامه نویسی </title>
    </head>
 
     <body>
        <address> تهران خیابان ولیعصر کوچه سهرابی پلاک ۶۴ </address>
        <p> این یک پاراگراف است </p>
     </body>

</html>

از روی کیبورد ctrl + s رو بزن که فایلت save بشه.

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

همه میدونن css و html دو عضو جدا نشدنین پس مقاله css چیست رو حتما بخون .

5 / 5 ( 1 امتیاز )
اشتراک گذاری:
برچسب ها: htmlhtml چیستاچ تی ام ال چیستاموزش htmlاموزش زبان htmlاموزش طراحی سایتطراحی سایت

مطالب زیر را حتما مطالعه کنید

تنظیمات پیکربندی(configuration) در لاراول

تنظیمات پیکربندی(configuration) در لاراول

در این مقاله از سری مقالات آموزش Laravel سایت نارنجک، تنظیمات پیکربندی(configuration) در لاراول رو با...
توابع در php

توابع در php

در این مقاله از سری مقالات آموزش PHP سایت نارنجک، با هم درمورد توابع در php...
ساختار برنامه در لاراول

ساختار برنامه ‌در لاراول

در این مقاله از سری مقالات آموزش Laravel سایت نارنجک، ساختار برنامه ‌در لاراول رو با...
کاربرد Attribute در HTML

کاربرد Attribute در HTML

بعد از آشنایی با ساختار تگ های HTML نوبت یادگیری Attribute ها است در این...
حلقه‌ها در زبان php

حلقه‌ها در زبان php

در این مقاله از سری مقالات آموزش PHP سایت نارنجک، با هم حلقه‌ها در زبان php...
meta tag چیست متا تگ ها در HTML

meta tag چیست متا تگ ها در HTML

meta tag چیست ؟ کاربرد متا تگ چیه ؟ توی سئو تاثیر داره ؟ در...
قدیمی تر متغیرها در زبان PHP
جدیدتر ide چیست

دیدگاهتان را بنویسید لغو پاسخ

جدیدترین مقالات
  • تنظیمات پیکربندی(configuration) در لاراول ۱۴۰۰/۰۱/۰۸
  • توابع در php ۱۳۹۹/۰۸/۱۶
  • data types در جاوا اسکریپت انواع داده ۱۳۹۹/۰۸/۱۶
  • ساختار برنامه ‌در لاراول ۱۳۹۹/۰۸/۱۱
  • کاربرد Attribute در HTML ۱۳۹۹/۰۸/۱۰
درباره نارنجک

ما در نارنجک به دنبال آموزش حرفه ای و پروژه محور شما هستیم. آموزش های بی‌نظیری که شما را از هر آموزش دیگری بی نیاز می‌کند.

  • info@narenjak.com
دسترسی سریع
  • مقالات
  • دوره ها
  • حساب کاربری
  • تماس با ما
  • درباره ما
تمامی حقوق برای سایت نارنجک محفوظ می باشد.

%30 تخفیف ویژه به مناسبت عید نوروز

ورود

رمز عبور را فراموش کرده اید؟

هنوز عضو نشده اید؟ عضویت در سایت