JavaScript QuickMenu, CSS3 border-radius(학습 26일차 TIL)

210714 어제 실습했던 navigation 메뉴를 복습하고, 미리 작성되어 있는 js를 삽입하여 side에 둥둥 떠다니는 quick 메뉴, border-radius에 대해 학습했다.
두 번째 시간에는 Figma 사용법에 대해 배웠다.

CSS3 tips

• border-image는 이미지를 9등분해서 기준을 만든다.

border-width: 10px; border-style: solid; border-image: url(images/border.png) 28 28 stretch round; 

• border-image-source: url(); border-color 대신 넣는것.
• border-image-slice: 이미지를 3x3 조각으로 나눠 지정.
• border-image-repeat: stretch 이미지 늘림, repeat 반복, round 이미지의 마지막을 작게하여 잘리지 않도록, space 이미지의 마지막이 잘릴 수 있음.
• CSS3 속성 앞에 브라우저를 식별할 수 있는 접두사 Vendor Prefix를 붙일 경우가 있다.
  (-webkit-사파리,크롬 / -moz- 파폭 / -o- 오페라 / -ms- 익스)