Save 37% off PRO during our Black Friday Sale! »

webサイトのiPhone X 対応

2d1275668d7b6a47d4e29415994313b8?s=47 井上拓
January 24, 2018

webサイトのiPhone X 対応

さくらの夕べ in すごい広島のLTスライド

2d1275668d7b6a47d4e29415994313b8?s=128

井上拓

January 24, 2018
Tweet

Transcript

  1. ͘͞Βͷ༦΂ in ͍͢͝޿ౡ webαΠτͷiPhone X ରԠ

  2. ࣗݾ঺հ

  3. Ҫ্ ୓ • ϑϩϯτΤϯυΤϯδχΞ • 1991೥6݄6೔ੜ·Εͷ26ࡀ • ່͔Θ͍͍ • CSS

    Nite in HIROSHIMA ࣮ߦһձ෭ҕһ௕ • ϑϩϯτΤϯυษڧձ ओ࠵ • [CodeCode](https://codecodeweb.com/) ࣗݾ঺հ
  4. ࣗݾ঺հ ݄ Ր ਫ ໦ ۚ ౔ ೔ ன ˕

    ˕ ˕ ˕ ˕ ˕ ൩ ˕ ˕ ˕
  5. ͘͞Βͷ༦΂ in ͍͢͝޿ౡ ʰोͳ͠୲ʑ໙͓͢͢Ίͷ৯΂ํʱ

  6. None
  7. None
  8. None
  9. None
  10. None
  11. ༨ന

  12. ༨നͷਖ਼ମ • iPhone Xͷૢ࡞ΤϦΞ • ͜ͷΤϦΞʹϘλϯ౳ૢ࡞͢ΔίϯςϯπΛஔ͘΂͖Ͱ͸ͳ͍

  13. ରࡦ NFUBOBNFWJFXQPSUDPOUFOUWJFXQPSUpUDPWFS

  14. None
  15. None
  16. None
  17. ରࡦ2 DPOUFOUT\ QBEEJOHMFGU ɹQBEEJOHSJHIU ^

  18. ରࡦ3 DPOUFOUT\ QBEEJOHMFGUDPOTUBOU TBGFBSFBJOTFUMFGU  QBEEJOHSJHIUDPOTUBOU TBGFBSFBJOTFUSJHIU  ^

  19. None
  20. ʁ

  21. None
  22. Կ΋มΘͬͯͳ͍

  23. The env() function shipped in iOS 11 with the name

    constant(). Beginning with Safari Technology Preview 41 and the iOS 11.2 beta, constant() has been removed and replaced with env(). You can use the CSS fallback mechanism to support both versions, if necessary, but should prefer env() going forward.
  24. The env() function shipped in iOS 11 with the name

    constant(). Beginning with Safari Technology Preview 41 and the iOS 11.2 beta, constant() has been removed and replaced with env(). You can use the CSS fallback mechanism to support both versions, if necessary, but should prefer env() going forward. env() ؔ਺͸ɺiOS 11Ͱconstant()ͱ͍͏໊લͰϦϦʔε͞Ε·ͨ͠ɻ Safari Technology Preview 41ͱiOS 11.2ϕʔλ൛͔Βɺconstant() ͸ ࡟আ͞Εɺenv() ʹஔ͖׵͑ΒΕ·ͨ͠ɻ CSSϑΥʔϧόοΫϝΧχ ζϜΛ࢖༻ͯ͠ɺඞཁʹԠͯ྆͡ํͷόʔδϣϯΛαϙʔτͰ͖·͢ ͕ɺࠓޙ͸env() Λ༏ઌ͢Δඞཁ͕͋Γ·͢ɻ
  25. The env() function shipped in iOS 11 with the name

    constant(). Beginning with Safari Technology Preview 41 and the iOS 11.2 beta, constant() has been removed and replaced with env(). You can use the CSS fallback mechanism to support both versions, if necessary, but should prefer env() going forward. env() ؔ਺͸ɺiOS 11Ͱconstant()ͱ͍͏໊લͰϦϦʔε͞Ε·ͨ͠ɻ Safari Technology Preview 41ͱiOS 11.2ϕʔλ൛͔Βɺconstant() ͸ ࡟আ͞Εɺenv() ʹஔ͖׵͑ΒΕ·ͨ͠ɻ CSSϑΥʔϧόοΫϝΧχζ ϜΛ࢖༻ͯ͠ɺඞཁʹԠͯ྆͡ํͷόʔδϣϯΛαϙʔτͰ͖·͕͢ɺ ࠓޙ͸env() Λ༏ઌ͢Δඞཁ͕͋Γ·͢ɻ
  26. The env() function shipped in iOS 11 with the name

    constant(). Beginning with Safari Technology Preview 41 and the iOS 11.2 beta, constant() has been removed and replaced with env(). You can use the CSS fallback mechanism to support both versions, if necessary, but should prefer env() going forward. env() ؔ਺͸ɺiOS 11Ͱconstant()ͱ͍͏໊લͰϦϦʔε͞Ε·ͨ͠ɻ Safari Technology Preview 41ͱiOS 11.2ϕʔλ൛͔Βɺconstant() ͸ ࡟আ͞Εɺenv() ʹஔ͖׵͑ΒΕ·ͨ͠ɻ CSSϑΥʔϧόοΫϝΧχζ ϜΛ࢖༻ͯ͠ɺඞཁʹԠͯ྆͡ํͷόʔδϣϯΛαϙʔτͰ͖·͕͢ɺ ࠓޙ͸env() Λ༏ઌ͢Δඞཁ͕͋Γ·͢ɻ
  27. ʂ

  28. ରࡦ4 DPOUFOUT\ QBEEJOHMFGUFOW TBGFBSFBJOTFUMFGU  QBEEJOHMFGUDPOTUBOU TBGFBSFBJOTFUMFGU  QBEEJOHSJHIUFOW TBGFBSFBJOTFUSJHIU

     QBEEJOHSJHIUDPOTUBOU TBGFBSFBJOTFUSJHIU  ^
  29. None
  30. None
  31. None
  32. ·ͱΊ • viewport-fit=cover • safe-area-inset-top
 safe-area-inset-right
 safe-area-inset-bottom
 safe-area-inset-left • ల։͸env()ͱconstant()

  33. ʰމຑ̎ਏ + Թۄ + ωΪ௥Ճʱ

  34. ͝੩ௌ͋Γ͕ͱ͏͍͟͝·ͨ͠