مطالب تصادفی
عکس
قالب مجله ای ورزش۳ برای و ...
عکس
قالب فارسی وردپرس میلاد ب ...
عکس
قالب فارسی Grand404 ...
مطالب محبوب
عکس
مصاحبه با آی وحید ...
عکس
قالب رایگان وردپرس unknow ...
عکس
قالب فارسی ۴رنگ ...
آخرین مطالب
عکس
مصاحبه با محمد محبی فر ...
عکس
فیلد سفارشی برای دیدگاه ه ...
عکس
تغییر جهت تقریبا اساسی ...
نودتم

ثبت نام
خوش آمدید ، برای استفاده بیشتر از امکانات نودتم وارد شوید یا ثبت نام کنید
  • عکس

    عرض ها برای طراحی واکنشگرا

    ۶ دیدگاه ۲۲ آبان ۱۳۹۳

    1415872593311 عرض ها برای طراحی واکنشگرا

    با سلام خدمت کاربران عزیز . در طراحی واکنشگرا نیاز به دانستن عرض های مختلف برای دستگاه های مختلف است . در این مطلب میخواهیم برخی از این ابعاد را بیان کنیم و امید وارم که نیاز شما را برطرف کنید . البته در برخی از دستگاه ها وب سایت ها بر اساس کیفیت صفحه ی نمایش آن دستگاه به نمایش در می آیند به عنوان مثال گوشی GALAXY S4 که صفحه ی نمایش فول اچ دی دارد وب سایت ها را در عرض ۱۰۸۰ نمایش می دهد .

    موبایل ها:

    iphone 3gs , iphone 4 , iphone 4s : 320 * 480

    iphone 5,iphone 5s : 320 * 568

    iphone 6 : 375 * 667

    iphone 6 + : 414 * 736

    sony xperia z, z1 : 360 * 640

    sony xperia sola,U : 480* 854

    sony xperia S , Ion : 360 * 640

    samsung Galaxy s4 : 360 * 640

    samsung Galaxy s, sII , W : 320 * 533

    samsung Galaxy SIII , Galaxy nexus : 320 * 640

    samsung Galaxy Note II : 360 * 640

    samsung Galaxy Note : 400 * 640

    samsung Galaxy Note 3 : 360 * 640

    HTC desire HD : 320 * 533

    تبلت ها :

    apple ipad 1 , 2 , 3 , 4 , ipadmini : 1024 * 768

    Google nexus 10 : 1280 * 800

    amazon kindle fire  HDX 8.9 : 2560 * 1600

     

    سیستم های ویندوزی اعم از لب تاپ و کامپیوتر های رو میزی معمولا ۱۳۳۶ * ۷۶۸ هستند

     

    * لیست دستگاه ها به روز خواهند شد

    * منبع : پایگاه توسعه گوگل

مطلب مرتبط
۶ دیدگاه برای این مطلب موجود است
  1. Matori73 می‌گه:

    سلام !
    در هدر سایتتون، وقتی موس رو میبریم روی عنوان “نود تم” عبارت “آغاز سال نو میلادی مبارک” ظاهر میشه …

    میشه یک آموزش یا توضیح در این مورد بدید ؟؟؟

    تشکر

    • محمد حسن می‌گه:

      یکی از خاصیت های هاور هست

      به عنوان مثال اگه شما یه دایو داشته باشید که توی اون یه اسپن وجود داشته باشه و اون اسپن display:none; باشه میتونید با کمک سی اس اس کاری کنید که وقتی روی دایو هاور صورت میگره اون اسپن display:block; بشه کدش هم اینجوری هست

      #divtest:hover span.test {display:block}

  2. روح الله می‌گه:

    سلام
    خیلی خوب بود
    برای طراحی واکنشگرایی باید برای هر سایز اندازه ها رو تغییر بدیم؟؟
    مثلا چندتا سایز رایج وجود نداره که حجم کدنویسی کمتر بشه؟!

    • محمد حسن می‌گه:

      سلام . بستگی به کد نویسی استایل داره اگه fixed باشه معمولا از @media screen and (max-width: 1280px) استفاده میشود
      اگر هم fixed نباشه معمولا از ۱۲۸۰ بعد به ۱۰۲۴ بعد به ۹۸۰ و بعد به ۸۰۰ و بعد به ۷۶۸ رسپانسیو انجام میشه میتوانید فاصله ی بین اینها همزمان انجام بدید به عنوان مثال @media screen and (min-width: 320px) and (max-width: 768px)

      موفق باشید

دیدگاهی بگذارید