CSS3 Properties

text-shadow

• Drop Shadow
• Glow
• Bevel
• Emboss
• Stroke
• Neon

-webkit-text-stroke

• OUTLINE
• OUTLINE+SHADOW
• SHADOW+NEON LIGHT

-webkit-backgtound-clip: text / -webkit-text-fill-color

HELLO WORLD!

border-radius（基本圓角）

• 只設定1個值
• 設定2個值
• 設定3個值
• 設定4個值

border-radius（正圓、橢圓）

• 正圓
• 橢圓

border-radius（以橢圓圓弧製作圓角）

• 圓角長方形
• 扭曲的圓形

box-shadow

• Drop Shadow
• Glow
• Inset Drop Shadow
• Inset Glow
• Spread Shadow
• Multi Shadow

border-images

background-size

• auto
• cover
• contain
• %
• px

linear-gradient()

• 2Colors（top → bottom）
• 3Colors（left → right）
• 3Colors（left top → right bottom）

radial-gradient()

• （circle）
• （closest-side）
• （at bottom）

repeating-linear-gradient()

• 條紋背景
• 條紋背景
• 條紋背景

repeating-radial-gradient()

• 放射狀背景
• 放射狀背景
• 放射狀背景

filter

• 

  grayscale()

• 

  sepia()

• 

  contrast()

• 

  brightness()

• 

  saturate()

• 

  hue-rotate()

• 

  invert()

• 

  opacity()

• 

  blur()