-webkit-이란 무엇인가?

-webkit-

웹페이지에 적용된 속성을 살펴볼 때 -webkit-이라는 prefix가 붙은 속성을 볼 수 있다. 이는 표준화가 되지 않은 새로운 기능들의 속성일 경우 -webkit-이라는 prefix를 달고 등장한다는 것이다. 많은 브라우저가 있지만, 대표적으로 Chrome이나 Safari 등의 브라우저에 탑재된 엔진으로 해당 브라우저에서만 작동한다. 따라서, 이러한 기능들을 활용해서 웹페이지를 구성하면 구형 IE에서는 작동하지 않아 제대로 오브젝트가 표현되지 않는다.

Webkit CSS properties

• -webkit-animation
• -webkit-animation-delay
• -webkit-animation-direction
• -webkit-animation-duration
• -webkit-animation-fill-mode
• -webkit-animation-iteration-count
• -webkit-animation-name
• -webkit-animation-play-state
• -webkit-animation-timing-function
• -webkit-appearance
• -webkit-backface-visibility
• -webkit-background-clip
• -webkit-background-composite
• -webkit-background-origin
• -webkit-background-size
• -webkit-border-bottom-left-radius
• -webkit-border-bottom-right-radius
• -webkit-border-horizontal-spacing
• -webkit-border-image
• -webkit-border-radius
• -webkit-border-top-left-radius
• -webkit-border-top-right-radius
• -webkit-border-vertical-spacing
• -webkit-box-align
• -webkit-box-direction
• -webkit-box-flex
• -webkit-box-flex-group
• -webkit-box-lines
• -webkit-box-ordinal-group
• -webkit-box-orient
• -webkit-box-pack
• -webkit-box-reflect
• -webkit-box-shadow
• -webkit-box-sizing
• -webkit-column-break-after
• -webkit-column-break-before
• -webkit-column-break-inside
• -webkit-column-count
• -webkit-column-gap
• -webkit-column-rule
• -webkit-column-rule-color
• -webkit-column-rule-style
• -webkit-column-rule-width
• -webkit-column-width
• -webkit-columns
• -webkit-dashboard-region
• -webkit-line-break
• -webkit-margin-bottom-collapse
• -webkit-margin-collapse
• -webkit-margin-start
• -webkit-margin-top-collapse
• -webkit-marquee
• -webkit-marquee-direction
• -webkit-marquee-increment
• -webkit-marquee-repetition
• -webkit-marquee-speed
• -webkit-marquee-style
• -webkit-mask
• -webkit-mask-attachment
• -webkit-mask-box-image
• -webkit-mask-clip
• -webkit-mask-composite
• -webkit-mask-image
• -webkit-mask-origin
• -webkit-mask-position
• -webkit-mask-position-x
• -webkit-mask-position-y
• -webkit-mask-repeat
• -webkit-mask-size
• -webkit-nbsp-mode
• -webkit-padding-start
• -webkit-perspective
• -webkit-perspective-origin
• -webkit-rtl-ordering
• -webkit-tap-highlight-color
• -webkit-text-fill-color
• -webkit-text-security
• -webkit-text-size-adjust
• -webkit-text-stroke
• -webkit-text-stroke-color
• -webkit-text-stroke-width
• -webkit-touch-callout
• -webkit-transform
• -webkit-transform-origin
• -webkit-transform-origin-x
• -webkit-transform-origin-y
• -webkit-transform-origin-z
• -webkit-transform-style
• -webkit-transition
• -webkit-transition-delay
• -webkit-transition-duration
• -webkit-transition-property
• -webkit-transition-timing-function
• -webkit-user-drag
• -webkit-user-modify
• -webkit-user-select