2013-02-15 4 views
2

방금 ​​부트 스트랩을 사용하기 시작했습니다. (저는 그리드 시스템을 사용한 적이 없습니다.) 유체 그리드 시스템을 구현하는 올바른 방법을 이해하는 데 문제가 있습니다. 나는 내가 사이트를 재 설계해야 할지도 모른다고 조금 걱정한다. 자세한 내용은 이미지를 참조하십시오.부트 스트랩에서 그리드 시스템을 올바르게 설정하려면 어떻게합니까?

문제 1 : 전체 사이트에서 흰색 테두리/패딩을 추가하고 크기를 조정하는 적절한 방법은 무엇입니까? 각 행의 시작과 끝을 추가해야합니까, 아니면 전 세계적으로 쉽게 적용 할 수 있습니까?

문제 2 : 내 콘텐츠 중 일부는 그림 슬라이더의 컨트롤과 같이 여백에 있습니다. 이것이 문제가 될 것인가 아니면 일부 패딩이있는 모든 열을 포함하는 범위를 작성하여 간단하게 해결할 수 있습니까?

문제점 3 : 부트 스트랩은 기본 12 열 시스템을 가지고 있지만 사용자 정의 다운로드를 사용하여 쉽게 사용자 지정할 수있는 것처럼 보입니다. @gridColumns 필드에 14를 입력하는 것만 큼 간단한가요? 아니면 px 너비도 변경해야합니까?

답변

2

문제 1 :

HTML

<div class="wrapper"> 
    <div class="container"> 
     // ... 
    </div>   
</div> 

CSS

.wrapper{ 
    border-right: 4px solid #fff; 
    border-left: 4px solid #fff; 
} 

문제 : 하나의 옵션은 예를 들어, DIV 콘텐츠를 포장하는 것입니다 2 : 예를 들어 margin-left: -20px과 같은 것을 사용하여 항목을 컨테이너 밖으로 밀어 낼 수 있습니다.

문제점 3 : 예, 빌더를 사용하여 사용자 정의 할 수 있지만, 예를 들어 기본 940 픽셀 너비를 유지하면서 14 열을 유지하려면, 너비 열 변수도 조정해야합니다.

관련 문제