سرفصل ها

  • persian developer network logo
  • آموزش HTML
    اصول اولیه HTML
    HTML چیست؟
    آناتومی یک عنصر HTML
    ایجاد اولین عنصر HTML شما
    عناصر تودرتو
    عناصر خالی
    ویژگی ها
    افزودن ویژگی‌ها به یک عنصر
    ویژگی های بولی
    حذف علامت نقل قول در اطراف مقادیر ویژگی‌ها
    نقل قول تکی یا دوتایی؟
    آناتومی یک سند HTML
    فضای خالی در HTML
    ارجاعات کاراکتری: اضافه کردن کاراکترهای ویژه در HTML
    کامنت های HTML
    متا دیتای صفحه وب
    سربرگ HTML چیست؟
    افزودن عنوان
    فراداده: عنصر <meta>
    مشخص کردن کدگذاری کاراکتر سند شما
    افزودن نویسنده و توضیحات
    بررسی کاربرد توضیحات در موتورهای جستجو
    انواع دیگر فراداده
    اضافه کردن آیکون‌های شخصی ساز به سایت
    اعمال CSS و جاوا اسکریپت به HTML
    تنظیم زبان اصلی سند
    سرفصل‌ها و پاراگراف‌ها
    سرفصل‌ها و پاراگراف‌ها
    اجرای سلسله مراتب ساختاری
    چرا به ساختار نیاز داریم؟
    چرا به معناشناسی نیاز داریم؟
    تأکید و اهمیت
    تأکید و اهمیت چیست؟
    تأکید
    اهمیت قوی
    ایتالیک، بولد، زیرخط‌دار…
    لیست ها
    لیست های نامرتب
    مرتب
    لیست های تودرتو
    لیست های توضیحات
    مثال لیست توضیحات
    چندین توضیح برای یک آیتم
    ویژگی های پیشرفته‌ی متن
    نقل قول ها
    نقل قول های بلوکی
    نقل قول های درون خطی
    نقل قول ها <cite>
    اختصارات
    علامت‌گذاری اطلاعات تماس
    بالانویس و زیرنویس
    نمایش کد کامپیوتر
    علامت‌گذاری زمان‌ها و تاریخ‌ها
    ساختاردهی اسناد
    بخش‌های اساسی یک سند
    سرصفحه ها
    نوار ناوبری
    محتوای اصلی
    نوار کناری
    پاورقی
    HTML برای ساختاردهی محتوا
    عناصر طرح‌بندی HTML با جزئیات بیشتر
    بسته‌بندی‌های غیرمعنایی
    شکست خطوط و خطکش افقی
    <br>: عنصر شکست خط
    <hr>: عنصر شکست موضوعی
    ساختاردهی یک وب‌سایت پایه
    ایجاد لینک‌ها
    هایپرلینک چیست؟
    آناتومی یک لینک
    لینک‌های سطح بلوک
    لینک‌های تصویر
    افزودن اطلاعات پشتیبانی با ویژگی عنوان
    مقدمه‌ای سریع بر URLها و مسیرها
    همان دایرکتوری
    حرکت به سمت پایین و زیرشاخه‌ها
    بازگشت به دایرکتوری‌های والد
    پیوند دادن نسبت به دایرکتوری ریشه
    لینک دادن با URL های کامل
    لینک‌های داخلی و خارجی
    قطعات سند
    چگونه URL ها به مسیرهای فایل تبدیل می شوند؟
    بهترین شیوه‌های لینک
    از متن لینک واضح استفاده کنید
    لینک دادن به منابع غیر HTML - علائم راهنمایی واضح بگذارید
    هنگام پیوند به یک فایل دانلود، از ویژگی دانلود استفاده کنید
    چه زمانی لینک‌ها را در تب جدید باز کنیم؟
    ایجاد منوی ناوبری
    لینک‌های ایمیل
    مشخص کردن جزئیات
    تصاویر
    چگونه یک تصویر را در صفحه وب قرار دهیم؟
    متن جایگزین
    عرض و ارتفاع
    تغییر اندازه تصاویر
    عنوان‌های تصویر
    دارایی‌های رسانه‌ای و مجوزها
    آشنایی با انواع مجوزها
    مالکیت عمومی/CC0
    جستجوی تصاویر دارای مجوز مجاز
    حاشیه‌نویسی تصاویر با شکل‌ها و زیرنویس شکل‌ها
    تصاویر پس زمینه CSS
    ویدئو و صوت HTML
    ویدئو و صدا در وب
    عنصر <video>
    استفاده از چندین قالب منبع برای بهبود سازگاری
    محتویات یک فایل رسانه‌ای
    پشتیبانی از فایل‌های رسانه‌ای در مرورگرها
    سایر ویژگی‌های <video>
    عنصر <audio>
    نمایش مسیر خطی ویدیوها
    اصول اولیه جدول HTML
    جدول چیست؟
    یک جدول چگونه کار می‌کند؟
    چه زمانی باید از جداول HTML اجتناب کنید؟
    اضافه کردن سرفصل با عناصر <th>
    چرا سرفصل‌ها مفید هستند؟
    اجازه دادن به سلول‌ها برای گسترش در چندین ردیف و ستون
    گروه بندی ستون ها با <colgroup> و <col>
    دسترسی‌پذیری جدول HTML
    استفاده از سرستون‌ها و سر سطرها
    اضافه کردن عنوان به جدول با استفاده از <caption>
    افزودن ساختار با <thead> و <tbody> و <tfoot>
    افزودن ساختار به جدول ثبت هزینه‌ها
    ویژگی scope
    ویژگی‌های id و headers
    فرم‌ها و دکمه‌ها در HTML
    تعامل با کاربران
    دکمه‌ها
    آناتومی یک فرم
    عنصر <form>
    ساختاربندی فرم‌ها
    عناصر <input>
    ویژگی‌های required و value در عمل
    ورودی‌های فیلد متنی تخصصی
    عناصر <label>
    برچسب‌های فرم صریح و ضمنی
    عنصر <button>
    نکته‌ای فرعی در مورد دسترسی‌پذیری
    انواع دیگر کنترل
    دکمه‌های رادیویی
    غیرفعال کردن کنترل‌های فرم
    کادرهای انتخاب
    منوهای کشویی
    فیلدهای ورودی متن چند خطی
    اعتبارسنجی فرم
    اشکال‌زدایی HTML
    اشکال زدایی ترسناک نیست
    HTML و اشکال‌زدایی
    استفاده از بازرس DOM
    نوبت شما: مطالعه HTML با استفاده از DOM inspector
    اعتبارسنجی HTML
    تفسیر پیام‌های خطا
    گنجاندن گرافیک‌های برداری در HTML
    گرافیک برداری چیست؟
    SVG چیست؟
    اضافه کردن SVG به صفحات شما
    راه سریع: عنصر img
    عیب‌یابی و پشتیبانی از مرورگرهای مختلف
    چگونه کد SVG را در HTML خود قرار دهیم
    نحوه جاسازی SVG با iframe
    از object تا iframe - فناوری‌های عمومی جاسازی
    تاریخچه کوتاهی از جاسازی
    iframe ها با جزئیات
    نگرانی‌های امنیتی
    فقط در صورت لزوم جاسازی کنید
    از HTTPS استفاده کنید
    همیشه از ویژگی sandbox استفاده کنید
    پیکربندی دستورالعمل‌های CSP
    عناصر <embed> و <object>
    آموزش CSS مبتدی
    CSS چیست؟
    استایل‌های پیش‌فرض مرورگر
    CSS برای چیست؟
    اصول اولیه سینتکس CSS
    CSS چگونه به HTML اعمال می‌شود؟
    شروع کار با CSS
    شروع با مقداری HTML
    اضافه کردن CSS به سند
    استایل دهی خارجی
    قرار دادن استایل‌شیت‌ها در مکان‌های مختلف
    استایل دهی داخلی
    استایل‌های درون‌خطی
    استفاده از انتخابگرهای رایج
    انتخاب عناصر HTML
    اضافه کردن کلاس
    استایل‌دهی به چیزها بر اساس موقعیت آنها در سند
    استایل‌دهی به چیزها بر اساس حالت (state)
    ترکیب انتخابگرها و ترکیب‌کننده‌ها
    سایر ویژگی‌های سینتکس CSS
    توابع
    تابع calc
    توابع تبدیل
    قوانین @
    ویژگی‌های مختصرنویسی
    کامنت‌های CSS
    فضای خالی در CSS
    انتخابگرهای CSS پایه
    انتخابگر (selector) چیست؟
    انتخابگرهای نوع (Type)
    انتخابگرهای کلاس (Class)
    هدف قرار دادن کلاس‌ها روی عناصر خاص
    انتخاب عنصری که بیش از یک کلاس دارد
    انتخابگرهای شناسه (ID)
    لیست‌های انتخابگر
    انتخابگرهای نامعتبر در فهرست‌های انتخابگر
    انتخابگر جهانی
    استفاده از انتخابگر سراسری برای خواناتر کردن انتخابگرهایتان
    انتخابگرهای ویژگی
    انتخابگرهای حضور و ارزش
    انتخابگرهای تطبیق زیررشته
    شبه کلاس‌ها و شبه عناصر
    شبه کلاس چیست؟
    مثال پایه‌ای از شبه کلاس
    شبه کلاس‌های تعامل کاربر
    شبه عنصر چیست؟
    ترکیب شبه کلاس‌ها و شبه عناصر
    تولید محتوا با before و after
    آیکون‌های محتوای تولید شده
    اشکال تولید شده
    ترکیب‌کننده‌ها
    ترکیب‌کننده‌ی نسلی
    ترکیب‌کننده فرزند
    ترکیب‌کننده‌ی sibling بعدی مستقیم
    ترکیب‌کننده‌ی sibling بعدی غیرمستقیم
    ترکیب ترکیب‌کننده‌ها با انتخاب‌کننده‌ها
    مدل جعبه‌ای
    جعبه‌های بلوکی و درون‌خطی
    انواع نمایشگر داخلی و خارجی
    نمونه‌هایی از انواع مختلف نمایشگر
    مدل جعبه‌ای CSS چیست؟
    قطعات یک جعبه
    مدل جعبه‌ای استاندارد CSS
    مدل جعبه‌ای جایگزین CSS
    استفاده از ابزارهای توسعه مرورگر برای مشاهده مدل جعبه‌ای
    مارجین‌ها، فاصله‌گذاری و حاشیه‌ها
    مارجین margin
    فروپاشی مارجین
    مرزها (حاشیه ها) border
    پدینگ padding
    مدل جعبه‌ای و جعبه‌های درون‌خطی
    استفاده از نمایش: inline-block
    رسیدگی به مغایرت ها
    قوانین متناقض
    آبشاری cascade
    مشخصه specificity
    وراثت inheritance
    درک چگونگی تعامل مفاهیم با یکدیگر
    درک وراثت
    کنترل وراثت
    تنظیم مجدد تمام مقادیر ویژگی‌ها
    درک آبشار
    ترتیب منبع
    مشخصه
    مثالی عمیق‌تر از جزئیات
    شناسه‌ها در مقابل کلاس‌ها
    استایل‌های درون‌خطی
    مهم!
    تأثیر مکان CSS
    ترتیب اعلان‌های برتر
    مقادیر و واحدهای CSS
    مقدار CSS چیست؟
    اعداد، طول‌ها و درصدها
    طول‌ها
    واحدهای طول مطلق
    واحدهای طول نسبی
    بررسی یک مثال
    em و rem
    درصدها
    اعداد
    رنگ color
    کلمات کلیدی رنگی
    مقادیر RGB هگزادسیمال
    مقادیر RGB
    یک مثال RGB با opacity
    استفاده از hue برای مشخص کردن یک رنگ
    HWB
    HSL
    تصاویر image
    موقعیت position
    رشته‌ها string و شناسه‌ها id
    توابع
    توابع ریاضی
    اندازه بندی آیتم ها در CSS
    اندازه طبیعی یا ذاتی آیتم ها
    تنظیم اندازه خاص
    استفاده از درصدها
    مارجین و پدینگ درصدی
    حداقل و حداکثر اندازه‌ها
    حداکثر عرض روی تصاویر max-width
    واحدهای viewport
    پس‌زمینه‌ها و حاشیه‌ها
    رنگ‌های پس‌زمینه
    تصاویر پس زمینه
    کنترل تکرار پس‌زمینه
    اندازه بندی تصویر پس زمینه
    قرار دادن تصویر پس زمینه
    پس‌زمینه‌های گرادیان
    تصاویر پس زمینه چندگانه
    پیوست پس‌زمینه
    استفاده از ویژگی مختصر نویسی background
    ملاحظات دسترسی پس زمینه
    حاشیه ها
    گوشه‌های گرد
    محتوای سرریز شده
    overflow یا سرریز چیست؟
    CSS تلاش می‌کند از «از دست رفتن داده‌ها» جلوگیری کند
    ویژگی overflow
    پنهان کردن محتوای سرریز شده
    اسکرول محتوای سرریز شده
    نمایش دادن اسکرول بار فقط درصورت نیاز
    سرریز ناخواسته در طراحی وب
    تصاویر، رسانه‌ها و عناصر فرم
    عناصر جایگزین شده
    اندازه بندی تصاویر
    مدیریت مشکلات نمایش تصویر با object-fit
    عناصر جایگزین شده در طرح بندی
    عناصر فرم
    استایل‌دهی به عناصر ورودی متن
    نرمال‌سازی رفتار فرم
    وراثت و عناصر فرم
    عناصر فرم و اندازه‌بندی جعبه‌ای
    سایر تنظیمات مفید
    درست کردن همه چیز با "reset"
    استایل‌دهی جداول
    یک جدول HTML معمولی
    شروع استایل‌دهی به جدول
    به‌روزرسانی فونت
    فاصله گذاری
    ترازبندی
    اضافه کردن حاشیه
    نوار گورخری
    استایل دادن به کپشن ها
    نکات ریز استایل‌دهی جداول
    اشکال‌زدایی CSS
    نحوه دسترسی به DevTools مرورگر
    DOM در مقابل منبع نمایش
    بررسی CSS اعمال شده
    ویرایش مقادیر
    افزودن یک ویژگی جدید
    درک مدل جعبه‌ای
    حل مسائل مربوط به مشخصه‌ها
    مشکلات اشکال‌زدایی در CSS
    از مشکل یک قدم عقب بروید
    آیا HTML و CSS معتبری دارید؟
    آیا ویژگی و مقدار توسط مرورگری که در آن آزمایش می‌کنید پشتیبانی می‌شوند؟
    آیا چیز دیگری CSS شما را نادیده گرفته است؟
    یک مورد آزمایشی کوچک‌شده از مشکل ایجاد کنید
    جلوه‌های پیشرفته استایل‌دهی
    سایه Box shadow
    یک box shadow ساده
    box shadow در تعداد
    سایر ویژگی‌های box shadow
    فیلترها
    حالت‌های ترکیبی
    حالت ترکیبی پس‌زمینه background-blend-mode
    حالت ترکیبی mix-blend-mode
    اشکال CSS
    -webkit-background-clip: text
    لایه‌های آبشاری
    بررسی مفهوم آبشار
    منشأ و آبشار
    منشأ و ویژگی
    مروری بر لایه‌های آبشاری
    ترتیب اولویت لایه آبشاری
    مسائلی که لایه‌های آبشاری می‌توانند حل کنند
    مسائلی که لایه‌های آبشاری تو در تو می‌توانند حل کنند
    ایجاد لایه‌های آبشاری
    دستور @layer در قاعده برای لایه‌های نامگذاری شده
    قاعده‌ی بلوک @layer برای لایه‌های نامگذاری شده و ناشناس
    ایجاد لایه و media query
    وارد کردن استایل شیت‌ها به لایه‌های نام‌گذاری شده و ناشناس با استفاده از @import
    مروری بر لایه‌های آبشاری تو در تو
    مزایای لانه سازی لایه ها
    ایجاد لایه‌های آبشاری تو در تو
    تعیین اولویت بر اساس ترتیب لایه‌ها
    ترتیب اولویت لایه‌های آبشاری منظم
    ترتیب اولویت لایه‌های آبشاری تو در تو
    مدیریت جهت‌های مختلف متن
    حالت‌های نوشتاری چیستند؟
    حالت‌های نوشتاری و طرح‌بندی بلوکی و درون‌خطی
    جهت
    ویژگی‌ها و مقادیر منطقی
    ویژگی‌های منطقی حاشیه، مرز و فاصله‌گذاری
    مقادیر منطقی
    آیا باید از ویژگی‌های فیزیکی استفاده کنید یا منطقی؟
    سازماندهی CSS شما
    آیا پروژه شما راهنمای سبک کدنویسی دارد؟
    ثابت قدم باشید
    قالب‌بندی CSS قابل خواندن
    CSS خود را کامنت کنید
    بخش‌های منطقی را در فایل استایل خود ایجاد کنید
    از انتخابگرهای بیش از حد خاص خودداری کنید
    استایل‌شیت‌های بزرگ را به چندین استایل‌شیت کوچک‌تر تقسیم کنید
    ابزارهای دیگری که می‌توانند کمک کنند
    روش‌های CSS
    OOCSS
    BEM
    سایر سیستم‌های رایج
    ساخت سیستم‌هایی برای CSS
    تعریف متغیرها
    کامپایل کردن استایل‌شیت‌های کامپوننت
    آموزش CSS پیشرفته
    استایل‌دهی اولیه متن و فونت
    استایل‌دهی به متن در CSS شامل چه مواردی می‌شود؟
    فونت‌ها
    رنگ
    خانواده‌های فونت
    فونت های در دسترس
    فونت‌های پیش‌فرض
    استک های فونت
    یک مثال از خانواده فونت
    اندازه فونت
    سبک فونت، وزن فونت، تبدیل متن و تزئین متن
    سایه‌های متن
    سایه‌های متعدد
    طرح‌بندی متن
    ترازبندی متن
    ارتفاع خط
    فاصله گذاری حروف و کلمات
    سایر ویژگی هایی که ارزش بررسی دارند
    خلاصه نویسی فونت
    استایل‌دهی به لیست‌ها
    یک مثال ساده از لیست
    مدیریت فاصله‌گذاری لیست‌ها
    سبک‌های خاص لیست
    استایل‌های گلوله‌ای
    موقعیت گلوله
    استفاده از تصویر گلوله شخصی ساز
    خلاصه نویسی به سبک لیست
    کنترل شمارش لیست
    start
    reversed
    value
    استایل‌دهی به لینک‌ها
    حالت‌های یک لینک
    سبک‌های پیش‌فرض
    استایل‌دهی به لینک‌ها
    لینک‌های خودتان را استایل‌دهی کنید
    قرار دادن آیکون روی لینک‌ها
    استایل‌دهی به لینک‌ها به عنوان دکمه
    فونت‌های وب
    خلاصه خانواده‌های فونت
    فونت‌های وب
    افزودن فونت‌های وب خودتان
    پیدا کردن فونت‌ها
    تولید کد مورد نیاز
    پیاده‌سازی کد در نسخه آزمایشی شما
    استفاده از یک سرویس فونت آنلاین
    font-face با جزئیات بیشتر
    مقدمه‌ای بر طرح‌بندی CSS
    جریان طرح‌بندی عادی
    عناصر به طور پیش‌فرض چگونه چیدمان می‌شوند؟
    مثال جریان عادی
    نادیده گرفتن جریان عادی
    سایر تکنیک‌های چیدمان
    float ها
    پس‌زمینه float
    مثالی از نوع float
    شناور کردن جعبه
    تجسم شناور
    پاک کردن شناورها
    جعبه‌های پاکسازی که دور یک شناور پیچیده شده‌اند
    مشکل
    display: flow-root
    موقعیت یابی
    معرفی موقعیت‌یابی position
    موقعیت‌یابی استاتیک static
    موقعیت‌یابی نسبی relative
    معرفی بالا، پایین، چپ و راست
    موقعیت‌یابی مطلق absolute
    زمینه‌های موقعیت‌یابی
    معرفی z-index
    موقعیت‌یابی ثابت fixed
    موقعیت‌یابی چسبنده sticky
    مثال پایه
    فهرست scroll
    فلکس‌باکس
    چرا فلکس باکس؟
    معرفی یک مثال ساده
    مشخص کردن عناصری که باید به عنوان flexbox طرح‌بندی شوند
    The flex model
    ستون‌ها یا ردیف‌ها؟
    بسته بندی
    خلاصه‌سازی جریان flex
    اندازه‌بندی انعطاف‌پذیر آیتم‌های flex
    flex: خلاصه‌نویسی در مقابل طولانی‌نویسی
    تراز افقی و عمودی
    ترتیب دهی به آیتم های فلکس
    flexbox تو در تو
    طرح بندی شبکه ای CSS
    طرح شبکه‌ای چیست؟
    ایجاد شبکه در CSS
    تعریف یک شبکه
    شبکه‌های انعطاف‌پذیر با واحد fr
    شکاف بین خطوط
    تکرار فهرست مسیرها
    شبکه‌های ضمنی و صریح
    تابع minmax
    تعداد ستون‌هایی که جا می‌شوند
    جایگذاری مبتنی بر خط
    موقعیت‌یابی با grid-template-areas
    شبکه‌ها و زیرشبکه‌های تودرتو
    چارچوب‌های شبکه‌ای
    طراحی وب واکنش‌گرا
    پیش درآمدی بر طراحی واکنش‌گرا: طراحی وب موبایل
    معرفی طراحی وب واکنش‌گرا
    media query ها
    فناوری‌های طرح‌بندی واکنش‌گرا
    Flexbox
    شبکه CSS
    تصاویر/رسانه‌های واکنش‌گرا
    تایپوگرافی واکنش‌گرا
    استفاده از مدیا کوئری‌ها برای تایپوگرافی واکنش‌گرا
    استفاده از واحدهای viewport برای تایپوگرافی واکنش‌گرا
    متا تگ viewport
    اصول media query ها
    اصول اولیه مدیا کوئری ها
    انواع رسانه
    قوانین مربوط به ویژگی‌های رسانه‌ای
    عرض و ارتفاع
    جهت گیری
    استفاده از دستگاه‌های اشاره‌گر
    استفاده از سینتکس محدوده‌ای
    مدیا کوئری های پیچیده‌تر
    منطق "and" در کوئری‌های رسانه‌ای
    منطق "or" در کوئری‌های رسانه‌ای
    منطق "not" در کوئری‌های مدیا
    نحوه انتخاب نقاط شکست
    طراحی واکنش‌گرا متناسب با موبایل (mobile-first)
    طراحی موبایل-محور خودتان را بسازید
    شروع به کار
    ایجاد طرح دو ستونه برای عرض‌های متوسط
    اضافه کردن ستون سوم برای صفحات نمایش عریض‌تر
    متای viewport
    آیا واقعاً به یک media query نیاز دارید؟
    طرح‌بندی چند ستونی
    طرح سه ستونه
    تنظیم عرض ستون
    استایل دادن به ستون‌ها
    ستون‌های پوشا
    ستون‌ها و قطعه قطعه شدن
    جعبه‌های تکه‌تکه شده
    تنظیم شکست های درونی
    مثال‌های عملی موقعیت‌یابی
    یک جعبه اطلاعات تب‌بندی‌شده
    تنظیمات عمومی
    استایل‌دهی به تب‌های ما
    استایل دادن به پنل‌ها
    جاوا اسکریپت
    یک جعبه اطلاعات با تب‌های ثابت
    اضافات HTML
    تغییرات در CSS موجود
    استایل‌دهی به محتوای اصلی
    یک پنل مخفی کشویی
    استایل دادن به دکمه
    استایل دادن به پنل
    تنظیم وضعیت بررسی‌شده
    آموزش جاوا اسکریپت مبتدی
    جاوا اسکریپت چیست؟
    تعریف کلی
    خب، واقعاً چه کاری می‌تواند انجام دهد؟
    جاوا اسکریپت در صفحه شما چه کاری انجام می‌دهد؟
    امنیت مرورگر
    ترتیب اجرای جاوا اسکریپت
    کد interpreted در مقابل کد compiled
    کد سمت سرور در مقابل کد سمت کلاینت
    کد پویا (dynamic) در مقابل کد ایستا (static)
    چگونه جاوا اسکریپت را به صفحه خود اضافه کنیم؟
    جاوا اسکریپت داخلی
    جاوا اسکریپت خارجی
    کنترل‌کننده‌های درون‌خطی جاوااسکریپت
    به جای آن از addEventListener استفاده کنید
    استراتژی‌های بارگذاری اسکریپت
    کامنت ها
    اولین نگاه به جاوا اسکریپت
    معرفی مثال «بازی حدس اعداد» ما
    فکر کردن مثل یک برنامه‌نویس
    خلاصه اولیه معماری
    راه اندازی اولیه
    اضافه کردن متغیرها برای ذخیره داده‌هایمان
    توابع Functions
    رشته‌های متنی Strings
    شرط ها Conditionals
    رویدادها Events
    تکمیل قابلیت‌های بازی
    حلقه‌ها Loops
    چه مشکلی پیش آمد؟ عیب‌یابی جاوا اسکریپت
    انواع ارور
    یک مثال ارور
    رفع ارورهای گزارش شده در کنسول
    رفع ارور زمان اجرا
    رفع یک ارور املایی دیگر
    یک ارور منطقی
    طی شدن مسیر منطقی
    سایر ارورهای رایج
    بازی بعد از اولین حدس اشتباه تمام می‌شود
    خطای املایی: وجود نداشتن ) بعد از لیست ورودی های ارزش به تابع
    خطای املایی: وجود نداشتن : بعد از شناسه ویژگی
    خطای املایی: } بعد از بدنه تابع وجود ندارد
    خطای املایی: جای عبارت (expression)، استرینگ است یا خطای املایی: استرینگ شامل یک پرش به خط جدید بدون املای درست است
    ذخیره اطلاعات مورد نیاز - متغیرها
    ابزارهایی که نیاز دارید
    متغیر چیست؟
    مثال متغیر
    بدون متغیر
    تعریف یک متغیر
    مقداردهی اولیه یک متغیر
    نکته‌ای در مورد متغیر var
    به‌روزرسانی یک متغیر
    نگاهی گذرا به قوانین نامگذاری متغیرها
    انواع متغیر
    اعداد numbers
    رشته‌ها string
    بولی‌ها booleans
    آرایه‌ها arrays
    اشیاء objects
    تایپ پویا
    ثابت‌ها در جاوا اسکریپت constants
    چه زمانی از const و چه زمانی از let استفاده کنیم؟
    ریاضیات پایه در جاوا اسکریپت - اعداد و اپراتور ها
    همه عاشق ریاضی هستند
    انواع اعداد
    برای من همه اینها عدد اند
    متدهای مفید اعداد
    تبدیل به انواع داده عددی
    اپراتورهای حسابی
    اولویت اپراتورها
    اپراتورهای افزایش و کاهش
    اپراتورهای انتساب
    اندازه بندی جعبه canvas
    اپراتورهای مقایسه‌ای
    مدیریت متن - رشته‌ها در جاوا اسکریپت
    قدرت کلمات
    تعریف رشته ها string
    علامت نقل قول تکی، علامت نقل قول دوتایی و علامت نقل قول معکوس
    جاسازی جاوا اسکریپت
    اتصال در متن
    اتصال با استفاده از "+"
    گنجاندن عبارات در رشته‌ها
    رشته‌های چندخطی
    گنجاندن نقل قول‌ها در رشته‌ها
    اعداد در مقابل رشته‌ها
    متدهای رشته‌ای مفید
    رشته‌ها به عنوان اشیاء
    پیدا کردن طول یک رشته
    بازیابی یک کاراکتر رشته‌ای خاص
    بررسی اینکه آیا یک رشته حاوی زیررشته است یا خیر
    پیدا کردن موقعیت یک زیر رشته در یک رشته
    استخراج یک زیررشته از یک رشته
    تغییر حالت
    به‌روزرسانی بخش‌هایی از یک رشته
    چالش‌های یادگیری
    فیلتر کردن پیام‌های تبریک
    اصلاح حروف بزرگ
    ساخت رشته‌های جدید از قطعات
    آرایه‌ها
    آرایه چیست؟
    ایجاد آرایه‌ها
    پیدا کردن طول یک آرایه
    دسترسی و تغییر آیتم‌های آرایه
    پیدا کردن شماره آیتم‌ها در یک آرایه
    اضافه کردن آیتم ها
    حذف موارد
    دسترسی به هر مورد
    تبدیل بین رشته‌ها و آرایه‌ها
    تصمیم‌گیری در کد شما - شرط‌ها
    به یه شرط!
    دستورات if...else
    سینتکس پایه if...else
    یک مثال واقعی
    else if
    نکته‌ای در مورد اپراتورهای مقایسه‌ای
    تو در تو سازی if...else
    عملگرهای منطقی: AND، OR و NOT
    دستورات سوئیچ
    یک مثال سوئیچ
    اپراتور سه تکه
    مثال اپراتور سه تکه
    حلقه ها در کد
    چرا حلقه‌ها مفید هستند؟
    مثال کد حلقه
    با حلقه و بدون حلقه
    حلقه زدن روی یک مجموعه
    حلقه for...of
    map و filter
    حلقه for استاندارد
    محاسبه مربع‌ها
    پیمایش مجموعه‌ها با حلقه for
    خروج از حلقه‌ها با break
    رد کردن تکرارها با continue
    while و do...while
    از کدام نوع حلقه باید استفاده کنید؟
    توابع - بلوک‌های کد قابل استفاده مجدد
    توابع رو از کجا پیدا کنم؟
    توابع داخلی مرورگر
    توابع و متدها
    فراخوانی توابع
    پارامترهای تابع
    پارامترهای اختیاری
    پارامترهای پیش‌فرض
    توابع بی نام و توابع پیکانی
    مثال تابع بی نام
    توابع پیکانی arrow functions
    نمونه زنده تابع arrow
    دامنه تابع و تداخلات
    نگاهی گذرا بر حلقه و دامنه شرطی
    تابع خودتان را بسازید
    بیایید یک تابع بسازیم
    تابع پایه
    فراخوانی تابع
    بهبود تابع با پارامترها
    یک پارامتر پیچیده‌تر
    مقادیر برگشتی تابع
    مقادیر بازگشتی چیستند؟
    نحوه برگرداندن یک مقدار
    پیاده‌سازی مقادیر بازگشتی تابع
    چند تا تابع خودت اضافه کن!
    مقدمه‌ای بر رویدادها
    رویداد چیست؟
    یک مثال: مدیریت یک رویداد کلیک
    استفاده از addEventListener
    گوش دادن به رویدادهای دیگر
    حذف شنوندگان رویداد
    اضافه کردن چندین شنونده برای یک رویداد واحد
    سایر مکانیزم‌های شنونده رویداد
    ویژگی‌های کنترل‌کننده رویداد
    کنترل‌کننده‌های رویداد درون‌خطی - از این‌ها استفاده نکنید
    اشیاء رویداد
    ویژگی‌های اضافی اشیاء رویداد
    جلوگیری از رفتار پیش‌فرض
    رویداد ها فقط مختص صفحات وب نیستند
    حباب رویداد
    تنظیم یک شنونده (listener) روی عنصر والد
    مثال حبابی
    مثال پخش کننده ویدیو
    رفع مشکل با stopPropagation
    ثبت رویداد
    نمایندگی رویداد
    target و currentTarget
    اصول اولیه شیء جاوا اسکریپت
    اصول اولیه شیء
    نمادگذاری نقطه‌ای
    اشیاء به عنوان ویژگی‌های اشیاء دیگر
    نمادگذاری با براکت
    تنظیم اعضای شیء
    «this» چیست؟
    معرفی سازنده‌ها
    تمام این مدت داشتید از اشیاء استفاده می‌کردید
    مقدمه‌ای بر اسکریپت‌نویسی DOM
    بخش‌های مهم یک مرورگر وب
    مدل شیء سند
    انجام برخی دستکاری‌های اولیه DOM
    ایجاد و قرار دادن گره‌های جدید
    جابجایی و حذف عناصر
    دستکاری استایل‌ها
    ایجاد درخواست‌های شبکه با جاوا اسکریپت
    مشکل اینجا چیست؟
    Fetch API
    دریافت محتوای متنی
    مثال خود را از یک سرور ارائه دهید
    فروشگاه قوطی
    API مربوط به XMLHttpRequest
    کار با JSON
    json چیست؟
    ساختار JSON
    آرایه‌ها به صورت JSON
    محدودیت‌های سینتکس JSON
    کار با یک مثال JSON
    شروع به کار
    تابع سطح بالا
    پر کردن هدر
    ایجاد کارت‌های اطلاعات قهرمانان
    فراخوانی تابع سطح بالا
    تبدیل بین اشیاء و متن
    اشکال‌زدایی و مدیریت ارور در جاوا اسکریپت
    خلاصه‌ای از انواع خطاهای جاوا اسکریپت
    کد خود را لینت کنید
    افزونه‌های ویرایشگر کد
    مشکلات رایج جاوا اسکریپت
    کنسول جاوا اسکریپت مرورگر
    API کنسول
    console.error و call stack
    رفع ارور
    استفاده از اشکال‌زدای جاوا اسکریپت
    مدیریت ارورهای جاوا اسکریپت در کد شما
    شرطی‌ها
    نمایش خطاهای سفارشی
    try...catch
    تشخیص ویژگی
    پیدا کردن کمک
    آموزش جاوا اسکریپت پیشرفته
    شئ و پروتوتایپ آن
    زنجیره پروتوتایپ
    ویژگی‌های سایه‌ای
    تنظیم پروتوتایپ
    استفاده از Object.create
    با استفاده از سازنده constructor
    ویژگی شخصی
    پروتوتایپ ها و وراثت
    برنامه‌نویسی شیءگرا
    کلاس‌ها و نمونه‌ها
    وراثت
    کپسوله سازی
    OOP و جاوا اسکریپت
    کلاس‌ها در جاوااسکریپت
    کلاس‌ها و سازنده‌ها
    حذف سازنده‌ها
    وراثت
    کپسوله سازی
    متدهای خصوصی
    جاوا اسکریپت ناهمزمان
    برنامه‌نویسی همزمان
    یک تابع همگام با اجرای طولانی مدت
    مشکل توابع همگام با اجرای طولانی مدت
    گرداننده‌های رویداد
    Callback ها
    نحوه استفاده از promise
    استفاده از fetch API
    زنجیر کردن promiseها
    گرفتن ارورها
    اصطلاحات promise
    ترکیب چندین promise
    async و await
    نحوه پیاده‌سازی یک API مبتنی بر promise
    پیاده‌سازی API مربوط به alarm
    بسته‌بندی setTimeout
    سازنده‌ی Promise
    استفاده از API مربوط به alarm
    استفاده از async و await با API مربوط به alarm
    معرفی workerها
    استفاده از web worker
    تولیدکننده‌ی همزمان عدد اول
    تولیدکننده‌ی عدد اول با worker
    انواع دیگر worker
    ابزار و نرم افزارها
    چگونه از گیت‌هاب استفاده کنم؟
    انتشار محتوا
    تنظیمات اولیه گیت‌هاب
    آماده‌سازی کد برای آپلود
    نگاهی گذرا به رابط‌های خط فرمان
    ایجاد یک مخزن (repo) برای کد شما
    آپلود فایل‌های شما در گیت‌هاب
    دانش بیشتر در مورد گیت‌هاب
    چگونه مطمئن شویم که وب‌سایت ما به درستی کار می‌کند؟
    در مرورگر خود تست کنید
    تصویر کجاست؟
    وضعیت‌های HTTP
    رفع خطای ۴۰۴
    ارور های رایج
    غلط املایی در آدرس
    خطاهای ۴۰۴
    خطاهای جاوا اسکریپت
    موارد بیشتر برای بررسی
    سرعت اجرا
    آیا سرور به اندازه کافی پاسخگو است؟
    یک چک لیست ساده
    چگونه یک سرور تست محلی راه‌اندازی کنیم؟
    فایل‌های محلی در مقابل فایل‌های راه دور
    مشکل در آزمایش فایل‌های محلی
    اجرای یک سرور HTTP محلی ساده
    استفاده از یک افزونه در ویرایشگر کد شما
    استفاده از Node.js
    استفاده از پایتون
    اجرای زبان‌های سمت سرور به صورت محلی
    چگونه فایل‌های خود را روی یک سرور وب آپلود کنیم؟
    خلاصه
    SFTP
    ورود به سیستم
    اینجا و آنجا: نمای محلی و از راه دور
    آپلود روی سرور
    آیا واقعاً آنلاین هستند؟
    Rsync
    ابزارهای رابط کاربری گرافیکی Rsync
    GitHub
    روش‌های دیگر برای آپلود فایل‌ها
    ابزارهای توسعه‌دهنده مرورگر چیست؟
    نحوه باز کردن ابزارهای توسعه (devtools) در مرورگر
    بررسی DOM inspector
    بررسی ویرایشگر CSS
    اشکال‌زدای جاوا اسکریپت
    بررسی دیباگر
    فهرست فایل‌ها
    کد منبع
    عبارات و نقاط توقف را تماشا کنید
    اطلاعات بیشتر
    کنسول جاوا اسکریپت
    اطلاعات بیشتر
    راهنمای HTML
    راهنمای HTML برای سینتکس و اعمال رایج
    عناصر درون‌خطی
    عناصر بلوک
    استفاده از اعتبارسنجی فرم HTML و API اعتبارسنجی محدودیت
    محدودیت‌های ذاتی و اساسی
    انواع input معنایی
    ویژگی‌های مرتبط با اعتبارسنجی
    فرآیند اعتبارسنجی محدودیت
    محدودیت‌های پیچیده با استفاده از API اعتبارسنجی محدودیت
    محدودیت ترکیب چندین فیلد: اعتبارسنجی کد پستی
    محدود کردن حجم فایل قبل از آپلود
    استایل‌دهی بصری اعتبارسنجی محدودیت‌ها
    دسته بندی محتوا
    محتوای فراداده metadata
    محتوای جریان flow
    محتوای بخش‌بندی section
    محتوای عنوان heading
    محتوای جمله‌بندی شده phrase
    محتوای جاسازی‌شده embed
    محتوای تعاملی interactive
    محتوای ملموس palpable
    عناصر بدون دسته بندی
    عناصر پشتیبان اسکریپت
    محتوای مرتبط با فرم
    مدل محتوای شفاف
    استفاده از فرمت‌های تاریخ و زمان در HTML
    مثال‌ها
    مبانی
    سال شمارها
    سال‌های کبیسه
    ماه‌های سال
    روزهای ماه
    رشته‌های هفته
    رشته‌های ماه
    رشته‌های تاریخ
    رشته‌های زمانی
    رشته‌های تاریخ و زمان محلی
    رشته‌های تاریخ و زمان سراسری
    رشته اختلاف در منطقه‌های زمانی
    مشکلات مربوط به تاریخ
    مشکل Y2K38 (اغلب سمت سرور)
    مشکل Y10k (اغلب از سمت کلاینت)
    استفاده از میکرودیتا در HTML
    واژگان
    محلی سازی
    ویژگی‌های سراسری
    مثال
    استفاده از میکروفرمت‌ها در HTML
    نحوه کار میکروفرمت‌ها
    موارد استفاده از میکروفرمت‌ها
    پیشوندهای میکروفرمت
    h-card
    مثال h-card تو در تو
    h-entry
    مثال h-entry پاسخ تجزیه‌شده
    h-feed
    h-event
    مثال h-event تجزیه‌شده‌
    مثال‌هایی از ویژگی‌های rel در میکروفرمت‌ها
    rel=author
    rel=license
    rel=nofollow
    درک ویژگی‌ها و حالت‌های استاندارد
    مرورگرها چگونه تشخیص می‌دهند که از کدام حالت استفاده کنند؟
    XHTML
    چطور ببینم از کدام حالت استفاده شده است؟
    استفاده از تصاویر واکنش‌گرا در HTML
    چرا تصاویر واکنش‌گرا؟
    چگونه تصاویر واکنش‌گرا (ریسپانسیو) ایجاد کنیم؟
    تغییر وضوح: اندازه‌های مختلف
    تغییر وضوح: اندازه یکسان، وضوح‌های متفاوت
    جهت هنری
    چرا نمی‌توانیم این کار را فقط با استفاده از CSS یا جاوا اسکریپت انجام دهیم؟
    پیاده‌سازی تصاویر واکنش‌گرای خودتان
    مرجع عناصر HTML
    عنصر <a>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    متن لینک ضعیف و غیرقابل دسترسی
    متن لینک قوی و قابل دسترسی
    رویدادهای onclick
    لینک‌های خارجی و لینک دادن به منابع غیر HTML
    لینکی که یک برگه/پنجره جدید باز می‌کند
    لینک به یک منبع غیر HTML
    لینک پرش
    سایز
    مجاورت
    لینک دادن به یک URL مطلق
    لینک دادن به URL های نسبی
    لینک دادن به یک عنصر در همان صفحه
    لینک دادن به یک آدرس ایمیل
    لینک دادن به شماره تلفن‌ها
    استفاده از ویژگی دانلود برای ذخیره <canvas> به عنوان PNG
    نمونه برنامه نقاشی با لینک ذخیره
    امنیت و حریم خصوصی
    خلاصه فنی
    نقش‌های مجاز ARIA
    عنصر <abbr>
    امتحانش کنید
    ویژگی‌ها
    موارد استفاده رایج
    ملاحظات دستوری
    استایل پیش‌فرض
    دسترسی‌پذیری
    علامت‌گذاری یک اختصار از نظر معنایی
    اختصارات استایل‌دهی
    فراهم کردن امکان گسترش
    تعریف یک اختصار
    عنصر <acronym> (منسوخ)
    ویژگی‌ها
    رابط DOM
    مثال
    استایل پیش‌فرض
    عنصر <address>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال
    عنصر <area>
    امتحانش کنید
    ویژگی‌ها
    تصویر با نواحی قابل کلیک
    عنصر <article>
    Try it
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال
    عنصر <aside>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    استفاده از <aside>
    عنصر <audio>
    امتحانش کنید
    ویژگی‌ها
    رویدادها
    یادداشت‌های استفاده
    استایل‌دهی با CSS
    تشخیص اضافه شدن و حذف شدن آهنگ‌ها
    دسترسی‌پذیری
    کاربرد اولیه
    عنصر <audio> به همراه عنصر <source>
    <audio> با چندین عنصر <source>
    عنصر <b>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال
    عنصر <base>
    ویژگی‌ها
    چندین عنصر <base>
    لینک های درون صفحه‌ای
    هدف ممکن است شامل خط جدید ASCII، تب یا < نباشد
    Open Graph
    مثال
    عنصر <bdi>
    امتحانش کنید
    ویژگی‌ها
    بدون bdi و فقط با LTR
    بدون bdi با متن RTL
    استفاده از bdi با متن LTR و RTL
    عنصر <bdo>
    امتحانش کنید
    ویژگی‌ها
    مثال
    یادداشت‌ها
    عنصر <big> (منسوخ)
    ویژگی‌ها
    استفاده از big
    استفاده از اندازه فونت در CSS
    رابط DOM
    عنصر <blockquote>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال
    عنصر <body>
    ویژگی‌ها
    ویژگی‌های رویداد
    ویژگی‌های منسوخ‌شده
    مثال
    عنصر <br>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    استایل‌دهی با CSS
    دسترسی‌پذیری
    br ساده
    عنصر <button>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌ها
    دکمه‌های آیکون
    سایز
    مجاورت
    اطلاعات حالت ARIA
    استایل‌های دکمه
    کلیک و فوکوس
    ایجاد یک دکمه پایه
    استفاده از مقدار request-close برای ویژگی command
    HTML
    عنصر <canvas>
    ویژگی‌ها
    محتوای جایگزین
    تگ پایانی <canvas>
    اندازه‌گذاری canvas با استفاده از CSS در مقابل HTML
    حداکثر اندازه canvas
    استفاده از canvas خارج از صفحه
    دسترسی پذیری:‌ محتوای جایگزین
    مثال
    عنصر <caption>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    یادداشت‌های استفاده
    مثال
    جدول با عنوان
    HTML
    عنصر <center> (منسوخ)
    رابط DOM
    مثال ۱
    مثال ۲ (جایگزین CSS)
    مثال ۳ (جایگزین CSS)
    عنصر <cite>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال
    عنصر <code>
    امتحانش کنید
    ویژگی‌ها
    مثال
    یادداشت‌ها
    عنصر <col>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    یادداشت‌های استفاده
    مثال
    عنصر <colgroup>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    یادداشت‌های استفاده
    مثال
    عنصر <data>
    امتحانش کنید
    ویژگی‌ها
    مثال
    عنصر <datalist>
    امتحانش کنید
    ویژگی‌ها
    دسترسی‌پذیری
    انواع متنی
    انواع تاریخ و زمان
    نوع محدوده
    نوع رنگ
    عنصر <dd>
    امتحانش کنید
    ویژگی‌ها
    مثال
    عنصر <del>
    امتحانش کنید
    ویژگی‌ها
    دسترسی‌پذیری
    مثال
    عنصر <details>
    امتحانش کنید
    ویژگی‌ها
    رویدادها
    یک مثال افشای اطلاعات اولیه
    ایجاد یک جعبه افشای اطلاعات عمومی
    چندین جعبه افشای نام‌گذاری شده
    سفارشی‌سازی ظاهر
    عنصر <dfn>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مشخص کردن اصطلاح مورد تعریف
    لینک‌ها به عناصر <dfn>
    شناسایی اولیه یک اصطلاح
    پیوند به تعاریف
    استفاده از اختصارات و تعاریف در کنار هم
    عنصر <dialog>
    ویژگی‌ها
    توضیحات
    کنترل دیالوگ‌ها با استفاده از جاوا اسکریپت
    دیالوگ‌های مودال با استفاده از دستورات invoker
    دیالوگ‌های غیرمودال با استفاده از دستورات popover
    بستن dialog
    استایل‌دهی CSS
    یادداشت‌های تکمیلی
    دسترسی‌پذیری
    ویژگی‌های HTML رابط برنامه‌نویسی کاربردی فرمان Invoker
    ویژگی‌های HTML API مربوط به Popover
    استفاده از ویژگی open در dialog
    ایجاد یک دیالوگ modal
    مدیریت مقدار برگشتی از کادر dialog
    بستن یک dialog با ورودی فرم الزامی
    مقایسه رفتارهای مختلف closedby
    انیمیشن در دیالوگ‌ها
    transition برای عنصر dialog
    انیمیشن‌های keyframe دیالوگ
    عنصر <dir> (منسوخ)
    رابط DOM
    ویژگی‌ها
    عنصر <div>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    دسترسی‌پذیری
    یک مثال اساسی
    یک مثال استایل شده
    عنصر <dl>
    امتحانش کنید
    ویژگی‌ها
    دسترسی‌پذیری
    مثال تک‌جمله و توضیح
    مثال چندین اصطلاح، یک توضیح
    مثال یک اصطلاح، چندین توصیف
    مثال اصطلاحات و توضیحات متعدد
    فراداده
    قرار دادن گروه‌های نام-مقدار در عناصر div
    یادداشت‌ها
    عنصر <dt>
    امتحانش کنید
    ویژگی‌ها
    مثال
    عنصر <em>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    <i> در مقابل <em>
    مثال
    عنصر <embed>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    دسترسی‌پذیری
    مثال
    عنصر <fencedframe> (آزمایشی)
    ویژگی‌ها
    سیاست‌های دسترسی موجود برای fencedframe
    فوکوس کردن در fencedframe
    موقعیت‌یابی و مقیاس‌بندی
    دسترسی‌پذیری
    مثال
    عنصر <fieldset>
    امتحانش کنید
    ویژگی‌ها
    استایل‌دهی با CSS
    مثال
    فیلدست غیرفعال
    عنصر <figcaption>
    امتحانش کنید
    ویژگی‌ها
    مثال
    عنصر <figure>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    تصاویر
    قطعه کدها
    نقل قول‌ها
    اشعار
    عنصر <font> (منسوخ)
    ویژگی‌ها
    رابط DOM
    عنصر <footer>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    دسترسی‌پذیری
    مثال
    عنصر <form>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های ارسال فرم
    مثال
    عنصر <frame> (منسوخ)
    ویژگی‌ها
    یک سند frameset
    عنصر <frameset> (منسوخ)
    ویژگی‌ها
    مثال
    عنصر <geolocation> (آزمایشی)
    ویژگی‌ها
    توضیحات
    ارتباط با API موقعیت جغرافیایی
    تنظیم زبان دکمه
    محتوای جایگزین
    مسدود کردن <geolocation>
    محدودیت‌های استایل‌دهی
    محدودیت‌های دسترسی
    محدودیت‌های ارزش
    محدودیت‌های پیچیده
    ویژگی‌هایی که می‌توانند به طور معمول تنظیم شوند
    دسترسی‌پذیری
    مثال استفاده اولیه
    عنصر های <h1>-<h6>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    از استفاده از چندین عنصر <h1> در یک صفحه خودداری کنید
    تعیین اندازه فونت یکنواخت برای <h1>
    ناوبری
    برچسب‌گذاری محتوای بخش
    همه سرفصل‌ها
    عنصر <head>
    ویژگی‌ها
    مثال
    عنصر <header>
    امتحانش کنید
    یادداشت‌های استفاده
    کاربرد تاریخی
    ویژگی‌ها
    دسترسی‌پذیری
    سربرگ صفحه
    سربرگ مقاله
    عنصر <hgroup>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال‌ها
    عنصر <hr>
    امتحانش کنید
    ویژگی‌ها
    مثال
    عنصر <html>
    ویژگی‌ها
    دسترسی‌پذیری
    مثال
    عنصر <i>
    امتحانش کنید
    ویژگی‌ها
    یادداشت‌های استفاده
    مثال
    عنصر <iframe>
    امتحانش کنید
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    اسکریپت نویسی
    ناوبری بالا در فریم‌های با مبدا متقابل
    موقعیت‌یابی و مقیاس‌بندی
    رفتار رویدادهای error و load
    دسترسی‌پذیری
    یک <iframe> ساده
    جاسازی کد منبع در <iframe>
    عنصر <img>
    امتحانش کنید
    فرمت‌های تصویر پشتیبانی‌شده
    خطاهای بارگذاری تصویر
    ویژگی‌ها
    ویژگی‌های منسوخ‌شده
    استایل‌دهی با CSS
    نوشتن توضیحات جایگزین معنادار
    شناسایی SVG به عنوان تصویر
    ویژگی عنوان
    مثال متن جایگزین
    لینک تصویری
    استفاده از ویژگی srcset
    استفاده از ویژگی‌های srcset و sizes
    نگرانی‌های امنیتی و حریم خصوصی
  • صفحه اصلیتمام مستنداتتست کددرباره سایت
تمام مستندات>آموزش HTML

آموزش HTML

• اصول اولیه HTML

• متا دیتای صفحه وب

• سرفصل‌ها و پاراگراف‌ها

• تأکید و اهمیت

• لیست ها

• ویژگی های پیشرفته‌ی متن

• ساختاردهی اسناد

• ایجاد لینک‌ها

• تصاویر

• ویدئو و صوت HTML

• اصول اولیه جدول HTML

• دسترسی‌پذیری جدول HTML

• فرم‌ها و دکمه‌ها در HTML

• اشکال‌زدایی HTML

• گنجاندن گرافیک‌های برداری در HTML

• از object تا iframe - فناوری‌های عمومی جاسازی

آموزش CSS مبتدی

• CSS چیست؟

• شروع کار با CSS

• انتخابگرهای CSS پایه

• انتخابگرهای ویژگی

• شبه کلاس‌ها و شبه عناصر

• ترکیب‌کننده‌ها

• مدل جعبه‌ای

• رسیدگی به مغایرت ها

• مقادیر و واحدهای CSS

• اندازه بندی آیتم ها در CSS

• پس‌زمینه‌ها و حاشیه‌ها

• محتوای سرریز شده

• تصاویر، رسانه‌ها و عناصر فرم

• استایل‌دهی جداول

• اشکال‌زدایی CSS

• جلوه‌های پیشرفته استایل‌دهی

• لایه‌های آبشاری

• مدیریت جهت‌های مختلف متن

• سازماندهی CSS شما

آموزش CSS پیشرفته

• استایل‌دهی اولیه متن و فونت

• استایل‌دهی به لیست‌ها

• استایل‌دهی به لینک‌ها

• فونت‌های وب

• مقدمه‌ای بر طرح‌بندی CSS

• float ها

• موقعیت یابی

• فلکس‌باکس

• طرح بندی شبکه ای CSS

• طراحی وب واکنش‌گرا

• اصول media query ها

• طرح‌بندی چند ستونی

• مثال‌های عملی موقعیت‌یابی

آموزش جاوا اسکریپت مبتدی

• جاوا اسکریپت چیست؟

• اولین نگاه به جاوا اسکریپت

• چه مشکلی پیش آمد؟ عیب‌یابی جاوا اسکریپت

• ذخیره اطلاعات مورد نیاز - متغیرها

• ریاضیات پایه در جاوا اسکریپت - اعداد و اپراتور ها

• مدیریت متن - رشته‌ها در جاوا اسکریپت

• متدهای رشته‌ای مفید

• آرایه‌ها

• تصمیم‌گیری در کد شما - شرط‌ها

• حلقه ها در کد

• توابع - بلوک‌های کد قابل استفاده مجدد

• تابع خودتان را بسازید

• مقادیر برگشتی تابع

• مقدمه‌ای بر رویدادها

• حباب رویداد

• اصول اولیه شیء جاوا اسکریپت

• مقدمه‌ای بر اسکریپت‌نویسی DOM

• ایجاد درخواست‌های شبکه با جاوا اسکریپت

• کار با JSON

• اشکال‌زدایی و مدیریت ارور در جاوا اسکریپت

آموزش جاوا اسکریپت پیشرفته

• شئ و پروتوتایپ آن

• برنامه‌نویسی شیءگرا

• کلاس‌ها در جاوااسکریپت

• جاوا اسکریپت ناهمزمان

• نحوه استفاده از promise

• نحوه پیاده‌سازی یک API مبتنی بر promise

• معرفی workerها

ابزار و نرم افزارها

• چگونه از گیت‌هاب استفاده کنم؟

• چگونه مطمئن شویم که وب‌سایت ما به درستی کار می‌کند؟

• چگونه یک سرور تست محلی راه‌اندازی کنیم؟

• چگونه فایل‌های خود را روی یک سرور وب آپلود کنیم؟

• ابزارهای توسعه‌دهنده مرورگر چیست؟

راهنمای HTML

• راهنمای HTML برای سینتکس و اعمال رایج

• استفاده از اعتبارسنجی فرم HTML و API اعتبارسنجی محدودیت

• دسته بندی محتوا

• استفاده از فرمت‌های تاریخ و زمان در HTML

• استفاده از میکرودیتا در HTML

• استفاده از میکروفرمت‌ها در HTML

• درک ویژگی‌ها و حالت‌های استاندارد

• استفاده از تصاویر واکنش‌گرا در HTML

مرجع عناصر HTML

• عنصر <a>

• عنصر <abbr>

• عنصر <acronym> (منسوخ)

• عنصر <address>

• عنصر <area>

• عنصر <article>

• عنصر <aside>

• عنصر <audio>

• عنصر <b>

• عنصر <base>

• عنصر <bdi>

• عنصر <bdo>

• عنصر <big> (منسوخ)

• عنصر <blockquote>

• عنصر <body>

• عنصر <br>

• عنصر <button>

• عنصر <canvas>

• عنصر <caption>

• عنصر <center> (منسوخ)

• عنصر <cite>

• عنصر <code>

• عنصر <col>

• عنصر <colgroup>

• عنصر <data>

• عنصر <datalist>

• عنصر <dd>

• عنصر <del>

• عنصر <details>

• عنصر <dfn>

• عنصر <dialog>

• عنصر <dir> (منسوخ)

• عنصر <div>

• عنصر <dl>

• عنصر <dt>

• عنصر <em>

• عنصر <embed>

• عنصر <fencedframe> (آزمایشی)

• عنصر <fieldset>

• عنصر <figcaption>

• عنصر <figure>

• عنصر <font> (منسوخ)

• عنصر <footer>

• عنصر <form>

• عنصر <frame> (منسوخ)

• عنصر <frameset> (منسوخ)

• عنصر <geolocation> (آزمایشی)

• عنصر های <h1>-<h6>

• عنصر <head>

• عنصر <header>

• عنصر <hgroup>

• عنصر <hr>

• عنصر <html>

• عنصر <i>

• عنصر <iframe>

• عنصر <img>

آموزش HTML

HTML (زبان نشانه‌گذاری ابرمتن) یا (HyperText Markup Language) اساسی‌ترین بلوک سازنده وب است. این زبان معنا و ساختار محتوای وب را تعریف می‌کند. فناوری‌های دیگری علاوه بر HTML معمولاً برای توصیف ظاهر/ارائه (CSS) یا عملکرد/رفتار (JavaScript) یک صفحه وب استفاده می‌شوند.

- اصول اولیه HTML

- HTML چیست؟

- آناتومی یک عنصر HTML

- ایجاد اولین عنصر HTML شما

- عناصر تودرتو

- عناصر خالی

- ویژگی ها

- افزودن ویژگی‌ها به یک عنصر

- ویژگی های بولی

- حذف علامت نقل قول در اطراف مقادیر ویژگی‌ها

- نقل قول تکی یا دوتایی؟

- متا دیتای صفحه وب

- سربرگ HTML چیست؟

- افزودن عنوان

- فراداده: عنصر <meta>

- مشخص کردن کدگذاری کاراکتر سند شما

- افزودن نویسنده و توضیحات

- بررسی کاربرد توضیحات در موتورهای جستجو

- انواع دیگر فراداده

- اضافه کردن آیکون‌های شخصی ساز به سایت

- اعمال CSS و جاوا اسکریپت به HTML

- تنظیم زبان اصلی سند

- سرفصل‌ها و پاراگراف‌ها

- سرفصل‌ها و پاراگراف‌ها

- اجرای سلسله مراتب ساختاری

- چرا به ساختار نیاز داریم؟

- چرا به معناشناسی نیاز داریم؟

- تأکید و اهمیت

- تأکید و اهمیت چیست؟

- تأکید

- اهمیت قوی

- ایتالیک، بولد، زیرخط‌دار…

- لیست ها

- لیست های نامرتب

- مرتب

- لیست های تودرتو

- لیست های توضیحات

- مثال لیست توضیحات

- چندین توضیح برای یک آیتم

- ویژگی های پیشرفته‌ی متن

- نقل قول ها

- نقل قول های بلوکی

- نقل قول های درون خطی

- نقل قول ها <cite>

- اختصارات

- علامت‌گذاری اطلاعات تماس

- بالانویس و زیرنویس

- نمایش کد کامپیوتر

- علامت‌گذاری زمان‌ها و تاریخ‌ها

- ساختاردهی اسناد

- بخش‌های اساسی یک سند

- سرصفحه ها

- نوار ناوبری

- محتوای اصلی

- نوار کناری

- پاورقی

- HTML برای ساختاردهی محتوا

- عناصر طرح‌بندی HTML با جزئیات بیشتر

- بسته‌بندی‌های غیرمعنایی

- شکست خطوط و خطکش افقی

- ایجاد لینک‌ها

- هایپرلینک چیست؟

- آناتومی یک لینک

- لینک‌های سطح بلوک

- لینک‌های تصویر

- افزودن اطلاعات پشتیبانی با ویژگی عنوان

- مقدمه‌ای سریع بر URLها و مسیرها

- همان دایرکتوری

- حرکت به سمت پایین و زیرشاخه‌ها

- بازگشت به دایرکتوری‌های والد

- پیوند دادن نسبت به دایرکتوری ریشه

- تصاویر

- چگونه یک تصویر را در صفحه وب قرار دهیم؟

- متن جایگزین

- عرض و ارتفاع

- تغییر اندازه تصاویر

- عنوان‌های تصویر

- دارایی‌های رسانه‌ای و مجوزها

- آشنایی با انواع مجوزها

- مالکیت عمومی/CC0

- جستجوی تصاویر دارای مجوز مجاز

- حاشیه‌نویسی تصاویر با شکل‌ها و زیرنویس شکل‌ها

- ویدئو و صوت HTML

- ویدئو و صدا در وب

- عنصر <video>

- استفاده از چندین قالب منبع برای بهبود سازگاری

- محتویات یک فایل رسانه‌ای

- پشتیبانی از فایل‌های رسانه‌ای در مرورگرها

- سایر ویژگی‌های <video>

- عنصر <audio>

- نمایش مسیر خطی ویدیوها

- اصول اولیه جدول HTML

- جدول چیست؟

- یک جدول چگونه کار می‌کند؟

- چه زمانی باید از جداول HTML اجتناب کنید؟

- اضافه کردن سرفصل با عناصر <th>

- چرا سرفصل‌ها مفید هستند؟

- اجازه دادن به سلول‌ها برای گسترش در چندین ردیف و ستون

- گروه بندی ستون ها با <colgroup> و <col>

- دسترسی‌پذیری جدول HTML

- استفاده از سرستون‌ها و سر سطرها

- اضافه کردن عنوان به جدول با استفاده از <caption>

- افزودن ساختار با <thead> و <tbody> و <tfoot>

- افزودن ساختار به جدول ثبت هزینه‌ها

- ویژگی scope

- ویژگی‌های id و headers

- فرم‌ها و دکمه‌ها در HTML

- تعامل با کاربران

- دکمه‌ها

- آناتومی یک فرم

- عنصر <form>

- ساختاربندی فرم‌ها

- عناصر <input>

- ویژگی‌های required و value در عمل

- ورودی‌های فیلد متنی تخصصی

- عناصر <label>

- برچسب‌های فرم صریح و ضمنی

- اشکال‌زدایی HTML

- اشکال زدایی ترسناک نیست

- HTML و اشکال‌زدایی

- استفاده از بازرس DOM

- نوبت شما: مطالعه HTML با استفاده از DOM inspector

- اعتبارسنجی HTML

- تفسیر پیام‌های خطا

- گنجاندن گرافیک‌های برداری در HTML

- گرافیک برداری چیست؟

- SVG چیست؟

- اضافه کردن SVG به صفحات شما

- راه سریع: عنصر img

- عیب‌یابی و پشتیبانی از مرورگرهای مختلف

- چگونه کد SVG را در HTML خود قرار دهیم

- نحوه جاسازی SVG با iframe

- از object تا iframe - فناوری‌های عمومی جاسازی

- تاریخچه کوتاهی از جاسازی

- iframe ها با جزئیات

- نگرانی‌های امنیتی

- فقط در صورت لزوم جاسازی کنید

- از HTTPS استفاده کنید

- همیشه از ویژگی sandbox استفاده کنید

- پیکربندی دستورالعمل‌های CSP

- عناصر <embed> و <object>

- آناتومی یک سند HTML

- فضای خالی در HTML

- ارجاعات کاراکتری: اضافه کردن کاراکترهای ویژه در HTML

- کامنت های HTML

- <br>: عنصر شکست خط

- <hr>: عنصر شکست موضوعی

- ساختاردهی یک وب‌سایت پایه

- لینک دادن با URL های کامل

- لینک‌های داخلی و خارجی

- قطعات سند

- چگونه URL ها به مسیرهای فایل تبدیل می شوند؟

- بهترین شیوه‌های لینک

- از متن لینک واضح استفاده کنید

- لینک دادن به منابع غیر HTML - علائم راهنمایی واضح بگذارید

- هنگام پیوند به یک فایل دانلود، از ویژگی دانلود استفاده کنید

- چه زمانی لینک‌ها را در تب جدید باز کنیم؟

- ایجاد منوی ناوبری

- لینک‌های ایمیل

- مشخص کردن جزئیات

- تصاویر پس زمینه CSS

- عنصر <button>

- نکته‌ای فرعی در مورد دسترسی‌پذیری

- انواع دیگر کنترل

- دکمه‌های رادیویی

- غیرفعال کردن کنترل‌های فرم

- کادرهای انتخاب

- منوهای کشویی

- فیلدهای ورودی متن چند خطی

- اعتبارسنجی فرم