960gs 레이아웃을 가지고 있지만 960grid 시스템을 사용하여이 페이지 (http://andreapuiatti.de/screenshots/question.png)의 내용을 중앙에 배치하는 가장 좋은 방법은 무엇인지 모르겠습니다.960 그리드 시스템의 사용자 지정 센터링 컨텐트
디자이너는이 디자인이 960gs를 기반으로하지만 지옥이 모든 항목에 있다는 것을 보증합니다!
유일한 해결책은 grid_12를 사용한 다음 사용자 정의 요소를 추가하는 것입니다.하지만 사용자 정의 요소를 추가하지만 그리드 시스템을 사용하는 이유는 무엇입니까?
이미지와 텍스트가 몇 개나 될지, 예를 들어 12를 결정하고 부모 컨테이너로 12 열 행을 만듭니다 (모두 960 그리드 프레임 워크 내에서).
그 행 내에서 래퍼 클래스를 만들고 클래스에 부여한 다음 이미지 또는 컨테이너에 margin: 0 auto;과 같은 표준 CSS 규칙을 적용합니다. 블록 레벨 요소에 랩핑되지 않은 경우 display: block을 이미지에 적용하십시오.
텍스트의 경우 p 요소가 래퍼 요소를 채우고 필요에 따라 여백을 조정할 수 있습니다.
일반적으로 이러한 CSS 그리드 프레임 워크는 콘텐츠, 텍스트 및 이미지 등을 포함하는 블록 레벨 상자를 만듭니다. 각 블록 내에서 요소를 배치하는 방법은 설계자가 결정해야합니다. 960.gs 및 유사한 CSS 프레임 워크는 그리드 레이아웃 내의 각 상자/블록/패널 내에서 내용의 스타일을 지정하는 것이 아니라 레이아웃을 정의합니다. 스크린 샷 및 디자이너 소개
"960.gs 및 유사한 CSS 프레임 워크는 레이아웃 만 정의하며 격자 레이아웃 내의 각 상자/블록/패널 내에서 내용의 스타일을 지정하는 세부 사항은 아닙니다." --- 고마워요. 내가 듣고 싶었던 것입니다. –
디자인과 접근에 대한 철학적 질문을했습니다. 도와 줘서 기쁩니다! 모두 제일 좋다! –
어떤 특정 요소 (화면 캡처에서)를 가운데에 놓으려고합니까? 이 디자인은 매우 직설적이며 960.gs에서 실행 가능해야합니다. –
이미지와 텍스트를 가운데에 맞춰야합니다. 예, CSS로 센터를 배치하는 방법을 알고 있지만 그리드 시스템은 무엇입니까? 그 이미지의 위치와 일치하도록 그리드를 중앙에 배치 할 수 없습니다! 아니면 이미 배치 된 grid_12를 채우는 사용자 정의 요소를 작성해야합니까? –
음악가 이미지의 왼쪽 및 오른쪽 가장자리가 이미지 다음에 오는 두 개의 큰 텍스트 단락의 왼쪽/오른쪽 가장자리를 정의하도록 하시겠습니까? –