주요 콘텐츠로 건너뛰기 문서 탐색으로 건너뛰기
Check
in English

사용자 정의

Sass, 다양한 글로벌 옵션, 광범위한 색상 시스템 등을 사용하여 Bootstrap을 테마, 사용자 지정 및 확장하는 방법을 알아보세요.

개요

부트스트랩을 사용자 정의하는 방법에는 여러 가지가 있습니다. 최상의 경로는 프로젝트, 빌드 도구의 복잡성, 사용 중인 부트스트랩 버전, 브라우저 지원 등에 따라 달라질 수 있습니다.

우리가 선호하는 두 가지 방법은 다음과 같습니다.

  1. 패키지 관리자를 통해 부트스트랩을 사용하여 소스 파일을 사용하고 확장할 수 있습니다.
  2. Bootstrap의 컴파일된 배포 파일 또는 jsDelivr 을 사용하여 Bootstrap의 스타일을 추가하거나 재정의할 수 있습니다.

여기에서 모든 패키지 관리자를 사용하는 방법에 대해 자세히 설명할 수는 없지만 고유한 Sass 컴파일러와 함께 부트스트랩을 사용 하는 방법에 대한 지침을 제공할 수 있습니다 .

배포 파일을 사용하려는 사람들은 시작하기 페이지 에서 해당 파일을 포함하는 방법과 예제 HTML 페이지를 검토하세요. 거기에서 사용하려는 레이아웃, 구성 요소 및 동작에 대한 문서를 참조하십시오.

부트스트랩에 익숙해지면 이 섹션을 계속 탐색하여 글로벌 옵션을 활용하는 방법, 색상 시스템을 사용 및 변경하는 방법, 구성 요소를 구축하는 방법, 늘어나는 CSS 사용자 정의 속성 목록을 사용하는 방법 및 방법에 대해 자세히 알아보세요. 부트스트랩으로 빌드할 때 코드를 최적화합니다.

CSP 및 임베디드 SVG

여러 Bootstrap 구성 요소에는 CSS에 포함된 SVG가 포함되어 있어 브라우저와 장치 전반에 걸쳐 구성 요소의 스타일을 일관되고 쉽게 할 수 있습니다. 보다 엄격한 CSP 구성 을 사용하는 조직을 위해 포함된 SVG의 모든 인스턴스(모두 를 통해 적용됨 background-image)를 문서화하여 옵션을 보다 철저하게 검토할 수 있습니다.

커뮤니티 대화 를 기반으로 자신의 코드베이스에서 이 문제를 해결하기 위한 몇 가지 옵션에는 URL을 로컬에서 호스팅되는 자산으로 교체, 이미지 제거 및 인라인 이미지 사용(일부 구성 요소에서 가능하지 않음) 및 CSP 수정이 포함됩니다. 자체 보안 정책을 신중하게 검토하고 필요한 경우 최선의 경로를 결정하는 것이 좋습니다.