نظرات ارزشمند شما:

برای ارسال نظر ابتدا باید وارد سایت شوید

    • سلام وقت بخیر.

      em یک واحد است که برابر با font-size کنونی تعیین شده برای عنصر می باشد.

      یعنی اگر عنصری دارای اندازه فونت 15px باشد پس 1em=15px است.

      h1 { font-size: 15px } /* 1em = 15px */
      
      p { font-size: 18px } /* 1em = 18px */

      در این مثال چون اندازه فونت h1 برابر با 15 پیسکل تعیین شده، پس اگر برای این عنصر از واحد em برای تعیین برخی از ویژگی های آن استفاده کنیم، هر em برابر با 15 پیکسل می باشد, مثلا:
      h1 { 
      
      font-size: 15px; /* 1em = 15px */
      padding-right: 2em; /* 2em = 2*15 = 30px */
      }

      پس همانطور که دیدیم برای فهمیدن اندازه هر em, به ویژگی font-size آن عنصر رجوع کردیم. حالا اگر این ویژگی برای عنصر تعیین نشده بود چی؟

      کافی است به ویژگی font-size پدر آن عنصر رجوع کنیم و اگر آن عنصر هم این ویژگی برایش تعیین نشده بود همینطور به بالا حرکت می کنیم تا در اجدادش عنصری پیدا کنیم که ویژگی font-size دارد و اگر در نهایت عنصری پیدا نشد, به عنصر ریشه که همان html است می رسیم و بصورت پیشفرض font-size برای html برابر با 16px می باشد.

      rem یا Root EM هم ایجاد شد تا محساباتی که در em وجود دارند را نداشته باشد. این واحد برابر با font-size ریشه است یعنی همیشه برابر با اندازه فونتی که برای html تعیین می شود می باشد.و بصورت پیشفرض font-size برای html برابر با 16px می باشد.
      header {
      
      font-size: 18px;
      }

      header h1 {
      font-size: 2rem; /* 2*16 = 32px */
      }

      h1 span {
      padding-right: 0.5rem; /* 0.5*16 = 8px */
      }

    • سلام وقت بخیر.
      اشکالی نداره از پیکسل استفاده کنید.em و rem واحد نسبی هستند در نهایت پیکسل هستن