تبلیغات در اینترنت

تبلیغات در اینترنتگیفت کارت گوگل پلی
صفحه 1 از 2 12 آخرینآخرین
نمایش نتایج: از 1 به 10 از 14

مقاله: آموزش کامل HTML اختصاصی وی بی ایران - جلسه سوم

    1. آموزش کامل HTML اختصاصی وی بی ایران - جلسه سوم »

      آموزش کامل HTML اختصاصی وی بی ایران - جلسه سوم

      نگارش: , by (طراح استایل / مدیر ارشد)
      2013/03/28 10:00 PM
      امتیاز: 

      با عرض سلام خدمت شما دوستان عزیز

      با جلسه سوم آموزش اختصاصی HTML در خدمتتون هستم.

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

      انواع عنصر در زبان برنامه نویسی HTML

      دوستان عزیز به این میگن" > " یک برچسب شروع و به این میگن " < " برچسب پایانی! حالا بین اینا ما هرچیزی بنویسیم میشه عنصر ما! مثلا اینجا رو ببینید: <b>VBIran</b> این عنصر ما باعث میشه که متن ما برجسته یا همون Bold بشه. که <b> اغاز کننده هست و <b/> پایانش هست.

      اینم یه نوع دیگه عنصر هست که در اصل بدنه ی HTML مارو تشکیل میده که با برچسب <body> شروع میشه و با برچسب <body/> به پایان میرسه!

      حالا همین برچسب ها خودش میتونه یه عنصر هم باشه مثلا: <body style="azimuth:center;>.

      حالا اگر بخواید یک جدول رو در داخل HTMl تون داشته باشید از این برچسب استفاده میکنید <table> که این هم مثل برچسب Body میتونه یه عنصر باشه مثل:
      کد:
      <table bordercolor="#666666">
      که با </table> هم بسته میشه.

      دقت داشته باشید که عناصر ما باید حتما در کتیشن " محدود بشن مثل ، مثالهای بالا که عرض کردم که شما میتونید از هر 2 نک کتیشن یعنی: ' یا دوبل " استفاده کنید که دوبل متداول تر هست.

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

      به مثالی که براتون میخوام بزنم خوب دقت کنید این رو ببینید:

      این یک تست میباشد.
      این یک تست میباشد.
      این یک تست میباشد.

      در اصل این نوشته کد هاش به این شکل هست که ادیتور نشونش نداده:

      کد:
      <p>این یک تست میباشد.</p>
      <p>این یک تست میباشد.</p>
      <p>این یک تست میباشد.</p>

      در اینجا میبینید که اگر خواستید متنی بنویسید که پاراگرافی ه ست باید از <p> </p> استفاده کنید.

      یکی دیگر از برچسب هایی که خیلی ها با اون مشکل دارن و همچنین در ٍْSEO خیلی اهمیت داره برچسب <h> هست. این برچسب ها از 1 تا 6 نامگذاری شده که به ترتیب دارای اولویت هستند.

      این برچسب ها برای عنوان نوشته استفاده میشه که به صورت خودکار باعث میشه یه فضایی به قبل و بعد تیتر ها اضافه بشه. این کدها به این صورت به کار میرن:

      کد:
      <h1>عنوان مطلب شما</h1>
      <h2>عنوان مطلب شما</h2>
      <h3>عنوان مطلب شما</h3>
      <h4>عنوان مطلب شما</h4>
      <h5>عنوان مطلب شما</h5>
      <h6>عنوان مطلب شما</h6>
      برچسب بعدی که میخوایم درموردش براتون توضیح بدم برچسب <br> هست که در XHTML به صورت </ br> استفاده میشه و این برچسب پایان نداره و تکی استفاده میشه برای این هست که شما مثلا میخواید یک نوشته رو تموم کنید ولی نمیخواید برید پاراگراف بعدی... این برچسب شما هر جایی ازش استفاده کنید شما رو یک خط پایین تر میبره.

      مثلا نگاه کنید به این کد:

      کد:
      <p>سلام<br />خوبی؟<br />ممنون</p>

      در اینجا میبینید که کل کد در یک خط نوشته شده اما وقتی داخل مرورگر اجرا میکنید به این شکل نمایش داده میشه:

      سلام
      خوبی؟
      ممنون


      یه سری کدنویسان رو دیدم برای انداختن فاصله میان از <br> استفاده میکنند که اشتباه بسیار بزرگی هست اینکار چون این کد در داخل مرورگرها متفاوت اجرا میشه و باعث میشه کدنویسی یک نواختی نداشته باشیم...
      آیا از سرگیجه های متعددی رنج میبرید؟ آیا کدنویسی که میکنید هنگ میکنید و نمیدونید چی نوشتید و چی کردید؟ دوای درد شما پیش منه

      خیلی از افرادی که کدنویسی میکنن کدنویسیشونو گم میکنن و مثلا یه اسلایدر کد میکنن بعد میخوان یه دایو یزارن اینور اونورش که کدشو گم میکنن 2 ساعت باید بگردن دنبالش خب شما با باز کردن یک براکت میتونید توضیحاتتون رو بنویسید و از این مشکل رهایی پیدا کنید. برای نوشتن یک براکت به صورت زیر عمل کنید:

      کد:
      <!--Doshvari Darim?! -->

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


      یکی دیگر از برچسب هایی که طراحان وب استفاده میکنن برچسب <hr> هست که در زبان XHTML با <hr /> نمایش داده میشه..این برچسب باعث میشه که شما یک خط افقی داشته باشید. مثلا:

      کد:
      <p>این نوشته تست میباشد.</p>
      <hr />
      اگر ما این کد رو بنویسیم خروجی ما این هست:



      برچسب بعدی <strong> </strong>هست و توضیح خاصی نداره در واقع با این برچسب شما میتویند متن ها رو بلد بنویسید مثلا:

      این نوشته تست میباشد.

      برچسب بعدی <big> </big> هست که متن هارو بزرگ میکنه مثلا:

      این نوشته تست میباشد.

      برچسب بعدی <em> </em> هست که باعث میشه متن مورب نوشته بشه

      برچسب بعدی <i> </i> هست که مثل em عمل میکنه.

      برچسب دیگری <small> </small> هسا که واضح هست نوشته رو کوچک میکنه.

      برچسب بعدی <sub> </sub> هست که متن رو زیر نویس نشون میده..مثلا:

      این نوشته تست میباشد. این نوشته تست میباشد.

      برچسب بعدی <sup> </sup> هست که متن رو بالا نویس نشون میده مثلا:

      این نوشته تست میباشد. این نوشته تست میباشد.

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


      تشکر فراموش نشه

      با تشکر

      نویسنده: Leberman
      پخش اختصاصی از وی بی ایران
      ویرایش توسط Leberman : 2013/03/29 در ساعت 01:20 PM
  1. Top | #2
    کاربر اخراجی

    ورژن ویبولتین
    4.2
    نوشته ها
    453
    میزان امتیاز
    0

    پیش فرض

    سلام استاد خیلی ممنون بابت اموزشتون!

    فقط اون نرم افزاری که توی قسمت اول اموزش گفتید من هر چی دنبالش گشتم برای دانلود لینکهای دانلودشون خراب بود!

    شما از کجا دانلود کردید میشه لینکشو بذارید!

    ممنون!

    کاربر مقابل از Amin1 بابت این پست مفید تشکر کرده است:


  2. Top | #3
    کاربر اخراجی

    ورژن ویبولتین
    Suite 4.2
    نوشته ها
    1,141
    میزان امتیاز
    0

    پیش فرض

    ممنون اقای معلم

    موفق باشید

    کاربر مقابل از RockstarGames بابت این پست مفید تشکر کرده است:


  3. Top | #4
    مدیر ارشد

    ورژن ویبولتین
    All Versions
    نوشته ها
    3,176
    میزان امتیاز
    447

  4. Top | #5
    کاربر اخراجی

    ورژن ویبولتین
    Suite 4.2
    نوشته ها
    1,141
    میزان امتیاز
    0

    پیش فرض

    اقا معلم چطوری به این رنگ و فونت بدیم ؟

    <p> test </p>

  5. Top | #6
    مدیر بازنشته

    ورژن ویبولتین
    4.x
    نوشته ها
    3,437
    میزان امتیاز
    446

    پیش فرض

    نقل قول نوشته اصلی توسط Leberman نمایش پست ها
    برچسب بعدی <strong> </strong>هست و توضیح خاصی نداره در واقع با این برچسب شما میتویند متن ها رو کج بنویسید مثلا:

    این نوشته تست میباشد.
    دوست عزیز <strong></strong> برای Bold کردن استفاده میشه ، که عمکرد مشابه با تگ <b></b> داره .

    اما متور های جستجو ، وقتی یک صفحه رو ایندکس میکنن ، وقتی به تگ strong برخورد میکنن ، به لغت یا لغات درون این تگ اهمیت ویژه ای میدن ! (برای سر تیتر ها مثلا استفاده میشه ، البته اگه نخواهیم از h استفاده کنیم)


    فک میکنم ، اشتباه تایپی بوده ، که گفته شده کج !

    2 تشکر توسط:


  6. Top | #7
    مدیر ارشد

    ورژن ویبولتین
    All Versions
    نوشته ها
    3,176
    میزان امتیاز
    447

    پیش فرض

    نقل قول نوشته اصلی توسط RSPF نمایش پست ها
    اقا معلم چطوری به این رنگ و فونت بدیم ؟

    <p> test </p>
    <p style="color:#666">test</p>

    نقل قول نوشته اصلی توسط OmidX نمایش پست ها
    دوست عزیز <strong></strong> برای Bold کردن استفاده میشه ، که عمکرد مشابه با تگ <b></b> داره .

    اما متور های جستجو ، وقتی یک صفحه رو ایندکس میکنن ، وقتی به تگ strong برخورد میکنن ، به لغت یا لغات درون این تگ اهمیت ویژه ای میدن ! (برای سر تیتر ها مثلا استفاده میشه ، البته اگه نخواهیم از h استفاده کنیم)


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

    ممنون

  7. Top | #8
    کاربر اخراجی

    ورژن ویبولتین
    Suite 4.2
    نوشته ها
    1,141
    میزان امتیاز
    0

    پیش فرض

    حالا اگه بخوایم از 2 تگ داخل همدیگر استفاده کنیم چطوریه ؟

    مثلا هم بخوایم <big> باشه هم <em>

  8. Top | #9
    مدیر ارشد

    ورژن ویبولتین
    All Versions
    نوشته ها
    3,176
    میزان امتیاز
    447

    پیش فرض

    نقل قول نوشته اصلی توسط RSPF نمایش پست ها
    حالا اگه بخوایم از 2 تگ داخل همدیگر استفاده کنیم چطوریه ؟

    مثلا هم بخوایم <big> باشه هم <em>
    عجب!
    کد:
    <big><em>test</em></big>

    3 تشکر توسط:


  9. Top | #10

    پیش فرض

    راستی بچه ها میتونید کد های خودتون رو در ادیتور زیر هم امتحان کنید :

    Real-time HTML Editor

    البته یکم که پیشرفته تر شد و خواستید بهش css و java Script هم اضافه کنید میتونید از این استفاده کنید :

    Create a new Fiddle - jsFiddle

    از Notepad ++ هم میتونید استفاده کنید ، اگه یکبار کد ها رو با فرمت html ذخیره کنید خودش کد ها رو براتون رنگی میکنه . اینطوری دیگه یادتون نمیره تگ ها رو ببندید !

    البته متاسفانه با فارسی مشکل داره یکم ، مثلا وقتی میخواهید یک قسمت رو که فارسی نوشتید پاک کنید یکم سخت میشه ! اما در کل خیلی به درد میخوره

    3 تشکر توسط:


صفحه 1 از 2 12 آخرینآخرین

اطلاعات موضوع

کاربرانی که در حال مشاهده این موضوع هستند

در حال حاضر 1 کاربر در حال مشاهده این موضوع است. (0 کاربران و 1 مهمان ها)

کسانی که این مقاله را دیده اند از این مقاله ها نیز بازدید کرده اند

  1. پاسخ: 178
    آخرين نوشته: 2016/10/20, 09:38 PM
  2. قالب HTML برای فروش محصولات به صورت آنلاین (اختصاصی وی بی ایران)
    توسط Arianismmm در انجمن دانلود استایل ها ، قالب های رایگان و پرمیوم
    پاسخ: 20
    آخرين نوشته: 2014/01/11, 03:47 PM
  3. آموزش کامل HTML اختصاصی وی بی ایران - جلسه دوم
    توسط Leberman در انجمن آموزش های وی بولتین
    پاسخ: 13
    آخرين نوشته: 2013/04/03, 12:19 PM
  4. آموزش کامل HTML اختصاصی وی بی ایران - جلسه یک
    توسط Leberman در انجمن آموزش های وی بولتین
    پاسخ: 17
    آخرين نوشته: 2013/03/28, 11:23 AM

علاقه مندی ها (Bookmarks)

علاقه مندی ها (Bookmarks)

مجوز های ارسال و ویرایش

  • شما نمیتوانید موضوع جدیدی ارسال کنید
  • شما امکان ارسال پاسخ را ندارید
  • شما نمیتوانید فایل پیوست کنید.
  • شما نمیتوانید پست های خود را ویرایش کنید
  •