๋งฅ์ ์ฌํ๋ฆฌ ๋ธ๋ผ์ฐ์ ์ ์์ดํฐIOS ์ ์ ์ฉ๋๋ CSS Hacks ์ ๋๋ค.
๋ชฉ์ฐจ ์จ๊ธฐ๊ธฐ
ํ๋ก์ ํธ์ ๊ฐ๋ ์์ดํฐ๊ณผ ์๋๋ก์ด๋, ์น๋ธ๋ผ์ฐ์ ๊ฐ์ ์คํ์ผ์ด ์ ์ฉ์ด ๋ค๋ฅผ ๋๋ ๊นจ์ง ๋ ์ฌ์ฉํ ์ ์๋ CSS ์ฝ๋ ์
๋๋ค.
ํต์ ์์ฐ๋ฉด ์ข๊ฒ ์ง๋ง, ๊ผญ ํ์ํ ๋๊ฐ ์๊ธฐ๊ธฐ๋ ํ๋..
์ ์ฉ ํ, ํ
์คํธ ์์ง ๋ง์ธ์~
Safari 6.1+
/* Safari 6.1+ (9.0 is the latest version of Safari at this time) */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
Safari 9.0+
/* Safari 9.0+ */
_::-webkit-:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
์์ค ์ฝ๋ ์์ญ์ ๋๋ธํด๋ฆญ ํ์๋ฉด, ์ฝ๋๊ฐ ์ ์ฒด ์ ํ ๋ฉ๋๋ค. ๊ทธ๋ฆฌ๊ณ ,ย ctrlย +ย cย /ย ctrlย +ย v
Safari 9
/* Safari 9 */
@supports (overflow:-webkit-marquee) and (justify-content:inherit)
{
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
์์ดํฐ ์ฌํ๋ฆฌ 9.0์ด์ ๋ง ์ ์ฉSafari 9.0+ (iOS Only)
/* Safari 9.0+ (iOS Only) */
@supports (-webkit-text-size-adjust:none) and (not (-ms-accelerator:true))
and (not (-moz-appearance:none))
{
.safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}
์ฌํ๋ฆฌ 9.0 ์ด์ ์น๋ธ๋ผ์ฐ์ ๋ง ์ ์ฉ โ Safari 9.0+ (non-iOS)
/* Safari 9.0+ (non-iOS) */
_:-webkit-full-screen:not(:root:root), .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
Safari 6.1-7.0
/* Safari 6.1-7.0 */
@media screen and (-webkit-min-device-pixel-ratio:0) and (min-color-index:0)
{
.safari_only {(;
color:#0000FF;
background-color:#CCCCCC;
);}
}
Safari 7.1+
/* Safari 7.1+ */
_::-webkit-full-page-media, _:future, :root .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
์ฌํ๋ฆฌ 6.1 ์ด์ ์น๋ธ๋ผ์ฐ์ ๋ง ์ ์ฉ โ Safari 6.1+ (non-iOS)
/* Safari 6.1+ (non-iOS) */
@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0)
{ @media {
_:-webkit-full-screen, .safari_only {
color:#0000FF;
background-color:#CCCCCC;
}
}}
์ฌ์ฉ๋ฐฉ๋ฒ์ CSS ํด๋์ค๋ก ์ ์ฉํ๊ณ , ์์ hack ์ style ์ ์ถ๊ฐํด์ฃผ์๋ฉด ๋ฉ๋๋ค.
This text will be Blue in Safari
viaย stackoverflowย (thanks to Jeff Clayton)