[부트스트랩] 캐러셀 적용, 스타일 덮기, rem 단위,

100일 코딩 챌린지 - Web Development 부트캠프 
331. 사용자 지정 코드와 타사 패키지 결합 [45일차]

• 캐러셀 적용
• 부트스트랩 스타일 덮는 방법
• 슬라이드 쇼 이미지 비율 맞추며 고정하기

 

 

rem 단위

• rem은 CSS에서 사용되는 크기 단위로, "Root EM"의 약자
• 1rem의 크기는 문서의 루트 요소(HTML)의 폰트 크기에 대한 상대적 크기를 나타냄 ( 예를 들어, HTML 요소의 폰트 크기가 16px라면, 1rem은 16px과 동일하게 됩니다.

rem 단위의 장점

1. 일관성: 모든 요소의 크기가 루트 요소의 폰트 크기에 기반하기 때문에, 루트 요소의 폰트 크기만 조정하면 전체 문서의 크기 조정이 가능
2. 유연성과 접근성: 사용자가 브라우저에서 기본 폰트 크기를 조정했을 때, rem 단위를 사용하는 요소들도 이에 맞춰 자동으로 조정됨
3. 코드의 간결성과 유지 보수: rem 단위를 사용하면 다양한 요소에 대한 크기 조정이 더 쉽고, 디자인의 일관성을 유지하기 수월

 

 

단위별 js 기능 적용하기

• 필요한 기능의 js코드를 검색

• 해당 태그의 엘리먼트를 받아와서 객체 생성하고 적용하기

let image = document.getElementsByClassName('thumbnail');
new simpleParallax(image);

오 이 기능 액자귀신 효과 가능할듯. 이미지 겹쳐서 안쪽에는 눈알.