جستجو برای:
  • خانه
  • طراحی سایت
  • خدمات ما
    • سامانه یادگیری الکترونیکی – سایا (LMS)
    • سامانه الکترونیکی مدیریت آموزش (ساما) (EMS)
    • پشتیبانی نرم افزار
    • پشتیبانی سخت افزار
    • پشتیبانی شبکه
    • پشتیبانی ماشین های اداری
  • نمونه کارها
  • قالب و افزونه
  • دسته بندی مطالب
    • آموزش مجازی
    • اخبار سینما
    • افزونه وردپرس
    • آموزش افزونه وردپرس
    • بازی
    • دوره های رایگان
    • سریال
    • فناوری
    • فیلم
      • اکشن
      • تاریخی
      • ترسناک
      • کمدی
      • هیجان انگیز
      • ورزشی
    • قالب وردپرس
      • قالب خبری و وبلاگ
      • قالب شرکتی
      • قالب نمونه کار
      • قالب های چند منظوره
    • مقالات
      • بازایابی دیجیتال
      • برنامه نویسی
      • تولید و بازاریابی محتوا
      • طراحی و گرافیک
  • تماس با ما
  • DMCA
  • پشتیبان سایت
 
  • 02144824488
  • info@myhamyar.com
  • بلاگ
  • تماس با ما
  • درباره ما
همیارِمَن  | آموزش برنامه نویسی و طراحی سایت | طراحی گرافیک
دسترسی سریع
  • پشتیبان سایت
0

ورود و ثبت نام

  • خانه
  • طراحی سایت
  • خدمات ما
    • سامانه یادگیری الکترونیکی – سایا (LMS)
    • سامانه الکترونیکی مدیریت آموزش (ساما) (EMS)
    • پشتیبانی نرم افزار
    • پشتیبانی سخت افزار
    • پشتیبانی شبکه
    • پشتیبانی ماشین های اداری
  • نمونه کارها
  • قالب و افزونه
  • دسته بندی مطالب
    • آموزش مجازی
    • اخبار سینما
    • افزونه وردپرس
    • آموزش افزونه وردپرس
    • بازی
    • دوره های رایگان
    • سریال
    • فناوری
    • فیلم
      • اکشن
      • تاریخی
      • ترسناک
      • کمدی
      • هیجان انگیز
      • ورزشی
    • قالب وردپرس
      • قالب خبری و وبلاگ
      • قالب شرکتی
      • قالب نمونه کار
      • قالب های چند منظوره
    • مقالات
      • بازایابی دیجیتال
      • برنامه نویسی
      • تولید و بازاریابی محتوا
      • طراحی و گرافیک
  • تماس با ما
  • DMCA
  • پشتیبان سایت

بلاگ

همیارِمَن | آموزش برنامه نویسی و طراحی سایت | طراحی گرافیکبلاگدوره های رایگانآموزش رایگان HTML مقدماتی تا پیشرفته بخش صفت ها

آموزش رایگان HTML مقدماتی تا پیشرفته بخش صفت ها

2 آبان 1400
ارسال شده توسط همیار من
دوره های رایگان
363 بازدید

آموزش صفت HTML به زبان ساده

  • صفت های HTML کلمات ویژه ای هستند که اطلاعات اضافی درباره عناصر ارائه می دهند و یا ویژگی های اصلاح کننده عنصر HTML هستند.
  • هر عنصر یا تگ می تواند صفت هایی داشته باشد که رفتار و و ضعیت آن عنصر را تعریف می کنند.
  • صفت ها همیشه باید در تگ شروع قرار گیرند.
  • صفت باید همیشه با دوتایی نام و مقدار آن استفاده شود.
  • نام و مقادیر صفت ها به کوچکی و بزرگی حروف حساس هستند و W3C (کنسرسیوم شبکه جهانی وب) توصیه می کند که فقط باید با حروف کوچک نوشته شوند.
  • می توانید چندین صفت را همزمان به یک عنصر HTML اعمال کنید اما باید بین هر دو صفت فاصله قرار دهید.

ساختار

فهرست عناوین

  • ساختار
  • توضیحات مثال بالا:
  • صفت title
    • مثال
  • کد:
  • خروجی کد:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
    <نام تگ نام صفت=”مقدار صفت”>محتوا</نام تگ>
 
     <!DOCTYPE html>
 
    <html>
 
    <head>
 
    </head>
 
    <body>
 
        <h1>  This is Style attribute </h1>
 
       <p style=”height: ۵۰px; color: blue”> It will add style property in element </p>
 
        <p style=”color: red”>It will change the color of content</p>
 
    </body>
 
    </html>

توضیحات مثال بالا:

1
    <p style=”height: ۵۰px; color: blue”>It will add style property in element</p>

برای یادگیری تمامی محبث های این دوره میتوانید اینجا کلیک کنید.

در جمله بالا از تگ پاراگراف استفاده کرده ایم که در آن صفت استایل به کار برده شده است. این صفت برای اعمال ویژگی CSS روی هر عنصر HTML استفاده می شود. با استفاده از این ویژگی ارتفاع پاراگراف px50 و رنگ آبی برای رنگ متن تنظیم شده است.

1
    <p style=”color: red”>It will change the color of content</p>

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

توجه: در اینجا تعدادی از صفات رایج را آورده ایم. همه صفات همراه با توضیحات آن ها در لیست صفات HTML آورده شده است.

صفت title

توضیحات: از صفت title به عنوان tooltip ( پنجره شناور) متن در بیشتر مرورگرها استفاده می شود. هنگامی که کاربر مکان نما را بر روی یک پیوند یا متن حرکت می دهد، یک متن به صورت شناور نمایش داده می شود. می توانید از این صفت برای هر متن یا پیوند برای نشان دادن توضیح درباره آنها استفاده کنید. در مثال های زیر این صفت را با تگ های p و h1 استفاده کرده ایم.

مثال

با تگ <h1>:

1
    <h1 title=”This is heading tag”>Example of title attribute</h1>

با تگ <p>:

1
    <p title=”This is paragraph tag”>Move the cursor over the heading and paragraph, and you will see a description as a tooltip</p>

کد:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
    <!DOCTYPE html>
 
    <html>
 
      <head>
 
     </head>
 
    <body>
 
       <h1 title=”This is heading tag”>Example of title attribute</h1>
 
      <p title=”This is paragraph tag”>Move the cursor over the heading and paragraph, and you will see a description as a tooltip</p>
 
    </body>
 
    </html>

خروجی کد:

بیشتر بخوانید:

  • چگونه توسعه دهنده وب شویم؟
  • چند پروژه تمرینی HTML و CSS
  • دانلود افزونه فرم ساز گرویتی فرمز| Gravity Forms
  • تکنیک‌های سئو دسته بندی محصولات در فروشگاه اینترنتی
  • آموزش رایگان HTML مقدماتی تا پیشرفته بخش تگ ها
  • معرفی زبان PHP و مزیت‌های آن
  • آموزش رایگان HTML مقدماتی تا پیشرفته
  • بهترین افزونه های اسلایدر وردپرس
  • آموزش رایگان HTML مقدماتی تا پیشرفته بخش تگ ها
  • آموزش رایگان HTML مقدماتی تا پیشرفته بخش دوم
  • چگونه این موضوع امکان پذیر خواهد شد
  • 20اقدام مهم برای افزایش امنیت وردپرس
  • آموزش رایگان HTML مقدماتی تا پیشرفته بخش سوم
  • چند پروژه تمرینی HTML و CSS
  • آموزش رایگان HTML مقدماتی تا پیشرفته بخش چهارم
  • برترین افزونه های جدول ساز وردپرس
اشتراک گذاری:
برچسب ها: آموزش html همیارمنآموزش رایگان html pdfآموزش رایگان html آموزش رایگان html5 و css3آموزش رایگان html همیارمنآموزش رایگان html و css مقدماتی آموزش رایگان html5 و css3 pdfآموزش رایگان html5آموزش رایگان زبان htmlاموزش رایگان html cssدانلود آموزش رایگان htmlصفت class در htmlصفت dir در htmlصفت display در htmlصفت float در htmlصفت id در htmlصفت lang در htmlصفت pattern در htmlصفت style در htmlصفت target در htmlصفت در html
در تلگرام
کانال ما را دنبال کنید!
در اینستاگرام
ما را دنبال کنید!

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

لوگو ادمین سایت

آموزش انیمیشن‌سازی با CSS

در این قسمت از آموزش انیمشن‌سازی در CSS قصد داریم به طور کلی به آموزش...
همیارمن

نحوه اضافه کردن کد PHP در وردپرس

اگر به دنبال اضافه کردن کد php در وردپرس به صفحات در وردپرس هستید به...

دوره رایگان طراحی فروشگاه اینترنتی!

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

آموزش ایجاد لیست کشویی وابسته به هم در HTML

در این مقاله در همیار من قصد داریم یکی از مطالب بسیار مهم و کاربردی...
ترفندهای عکاسی حرفه‌ای با موبایل (ساده و بدون هزینه!)

ساده و بدون هزینه ترفند های عکاسی حرفه ای با موبایل را یاد بگیرید

یکی از وسایلی که امروزه تقریبا با همه ما همراه شده است و ساعت‌ها آن...
لوگو ادمین سایت

DOM چیست و چه کاربردی دارد؟

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

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

جستجو در همیارمَن
جستجو برای:
  • آموزش مجازی
  • اخبار سینما
  • افزونه وردپرس
    • آموزش افزونه وردپرس
  • بازی
  • پیشنهادی
  • دسته‌بندی نشده
  • دوره های رایگان
  • سریال
  • فناوری
  • فیلم
    • اکشن
    • تاریخی
    • ترسناک
    • جنایی
    • کمدی
    • مستند
    • معمایی
    • هیجان انگیز
    • ورزشی
  • قالب HTML
  • قالب وردپرس
    • قالب خبری و وبلاگ
    • قالب شرکتی
    • قالب نمونه کار
    • قالب های چند منظوره
  • مقالات
    • بازایابی دیجیتال
    • برنامه نویسی
    • تولید و بازاریابی محتوا
    • طراحی و گرافیک
آخرین مطالب سایت
  • آموزش انیمیشن‌سازی با CSS
  • بهترین فیلم های اسلشر تاریخ سینما
  • نقد فیلم Cure – یک فیلم هیپنوتیزم کننده
  • نقد فیلم یتیم Orphan: First Kill
  • کسب درآمد از آموزش آنلاین چگونه است؟
برچسب‌ها
CSS HTML آموزش آموزش CSS آموزش css3 آموزش css3 pdf آموزش css3 رایگان آموزش css3 پیشرفته آموزش css pdf آموزش css حرفه ای آموزش css و html آموزش css پروژه محور آموزش css پیشرفته آموزش افزونه وردپرس آموزش تولید محتوا آموزش رایگان html همیارمن آموزش رایگان زبان html آموزش وب سایت افزونه وردپرس بازاریابی بازاریابی دیجیتال بازی بررسی بررسی بازی تولید محتوا دانلود افزونه وردپرس دانلود قالب وردپرس دوره دوره رایگان دیجیتال مارکتینگ سایت فناوری فیلم قالب قالب سایت قالب وب سایت قالب وردپرس نقد نقد بازی نقد فیلم نقد و بررسی نقد و بررسی بازی نقد و بررسی فیلم وردپرس ووکامرس

ورود

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

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