반응형

CSS 2

[CSS] 기초 / CSS 연결 link / import 차이

CSS link와 import 차이 작성 위치 - link와 import 모두 head 섹션에 있지만, link 태그는 상단에 작성되고, import는 head 섹션 내부의 style 태그 안에 작성된다. DOCTYPE html> Page Title DOCTYPE html> Page Title @import url("main.css"); 비교 사용은 비슷하나, link 방식을 사용하는 것이 @import 방식을 사용하는 것보다 페이지의 로딩 속도 측면에서 뛰어나다. link 방식 - HTML의 link 태그 사용 - 유지보수 용이 : CSS 연결 방식으로 하나의 파일에 여러 페이지의 스타일을 일괄 수정 및 추가 - 직렬방식이 아닌 병렬방식으로 다운로드 하기떄문에, 로딩속도 빠르다. @import 방식 -..

IT/Etc. 2023.02.22

[CSS] Vendor Prefix(접두어) webkit, moz, o, ms

웹 개발을 하면서 CSS에 -webkit-, -moz-, -o-, -ms- 접두어가 속성 앞에 붙어 있는 것을 볼 수 있다. 이는 벤더프리픽스 (Vendor Prefix)라 하며, 이 접두어들은 크로싱 브라우저를 위해 사용된다. 각 접두어의 의미는 아래와 같다. -webkit- : 구글의 크롬, 애플의 사파리 웹 브라우저에 적용한다. -moz- : 웹브라우저 모질라 (파이어폭스)에 적용한다. -ms- : MS(마이크로소프트)의 인터넷익스플로러에 적용한다. -o- : 오페라 웹 브라우저에 적용한다. 간단한 사용 예제 .example {border-radius: 1em;-webkit-border-radius: 1em;-moz-border-radius: 1em;-o-border-radius: 1em;-ms-b..

IT/Etc. 2017.12.26
반응형