포트폴리오를 만들고 브라우저 페이지의 중심에 포트폴리오를 만들 수있는 방법을 알고 싶습니다. 그것에 링크는 http://optiq-portfolio.zxq.net/portfolio.html어떻게이 페이지를 가운데에 배치 할 수 있습니까?
내가 CSS에서 몸에
margin-left:0 auto;
margin-right:0 auto;
을 추가하는 시도이다,하지만 작동하지 않습니다. 이 문제를 어떻게 해결할 수 있습니까?
여백을 본문에 추가하고 싶지 않은 경우이를 처리하는 적절한 방법은 margin: 0px auto; text-align:left; 인 컨테이너 요소를 사용하는 것입니다. 귀하의 신체 요소에 당신은 text-align:center;을 원할 것입니다.
나머지 코드는 컨테이너 요소에 포함되어야합니다.
이렇게하면 대부분의 최신 브라우저에서 페이지의 중심에 위치합니다.
그 이상의 것이 있습니다. 래퍼 div를 정의하고 그 너비를 설정 한 다음 사용해야합니다. margin: 0 auto
예를 들어 body이 width:1000px;으로 정의 된 경우 이미 가운데 맞춤이됩니다. 물론, 이것은 당신의 나머지 부분을 엉망으로 만든다.
margin-left: 0 auto도 유효하지 않습니다.
다른 사람들이 말했듯이, 당신이 주 콘텐츠를 둘러 쌀 수 있도록 래퍼 컨테이너를 만들어야합니다. 그런 다음 CSS로 고정 너비와 자동 가로 여백을 지정하십시오. David Walsh는 그의 블로그 게시물 Horizontally Center Your Website Structure Using CSS에서 이에 대한 좋은 설명을하고 있습니다.
HTML
<html>
<head>
<title>My Site</title>
</head>
<body>
<div id="wrap">
<!-- WEBSITE GOES HERE -->
</div>
</body>
</html>
CSS
#wrap {
width: 900px;
margin: 0 auto;
}
margin-left: 0 auto; 및 margin-right: 0 auto; 유효한 CSS 속성이 아니다.
margin:0 auto;과 같이 할 수 있습니다. 상단 및 하단을 0으로 설정하고 왼쪽에서 오른쪽으로 자동 설정합니다.