부트 스트랩 코드가 응답하지 않는 이유는 무엇입니까?

Question

저는 사용자 지정 WordPress 테마를 만들고 있어요. 내 친구가 부트 스트랩을 사용하여 페이지 코드를 작성하는 것을 지켜보고있었습니다. 그는 자신의 모니터를 중심으로 만들었습니다. 나는 그가 4 : 3 모니터를 사용하고 있다고 생각한다. 내 24 인치 와이드 스크린에서 페이지를 볼 때 페이지가 중앙에 있지 않습니다. 페이지를 어떤 화면 크기에도 반응하지 못하게하는 것은 무엇을 잘못하고 있습니까? 이 페이지에 대한 내 코드입니다 :

<?php get_header(); ?> 

<div class="row"> 

<div class="span1"></div> 

<div class="span8" id="container"> 
<?php the_post(); ?> 
<?php the_content(); ?> 
</div> 

<div class="span2"> 
<?php get_sidebar();?> 
</div> 

<div class="span1"></div> 

</div> 

<?php get_footer(); ?> 

여기에 헤더에 대한 코드입니다 : 내가 그래서 어쩌면 내가 그것을 잘못된 구문을 사용하고 부트 스트랩 사용에 새로운 오전

<meta http-equiv="content-type" content="<?php bloginfo('html_type'); ?>;charset=<?php bloginfo('charset'); ?>" /> 

<link rel="stylesheet" type="text/css" href="<?php bloginfo('stylesheet_url'); ?>" /> 

<center> 
<div class="row"> 
    <div class="span3"></div> 

<div class="span6"> 
<div class="logo"> 
<h1 id="logo-mathew">Mathew J. Mari</h1> 
<h3 id="logo-attorney">Attorney At Law</h3> 
</div> 
</div> 

<div class="span3"></div> 

</div> 
</center> 

응답 성이 있어야합니까? 아니면 뭔가를 남겨 두었습니까? 난 그저 모든 모니터에서 반응 형이되고, 1-8-2-1 열 레이아웃을 중심으로 활용하고 싶습니다. 어떤 도움이라도 대단히 감사하겠습니다.

Answer 1

컨테이너 태그는 행에 걸쳐 사용되어야없는 다른 모든 태그 응답 성 고정 폭 컨테이너

사용 .container된다. 뷰포트의 전체 폭에 걸친 전체 폭 컨테이너

...

사용 .container 유체.

...

Answer 2

첫째는 Bootstrap i.e 2.3의 이전 버전을 사용하고 부트 스트랩 이미 새로운 version 3.0 그렇게으로 업그레이드하시기 바랍니다 발표했다 .

사용중인 버전에서 참조 할 필요가있는 또 다른 CSS가 있으며 이는 반응 형입니다. 또한 기본 컨테이너에 .container-fluid을 추가하십시오.

Answer 3

클래스 추가 .COL 중심의 페이지 래퍼 DIV

.col-centered{ 
     margin:0 auto; 
     float : none; 
     display:block; 
} 

에 그것은 어떤 크기의 모니터

Answer 4

는 부트 스트랩의 이전 버전을 사용하는 것이 보인다에서 페이지를 중심으로. 최신 버전을 사용하면 요소를 훨씬 쉽게 중앙에 배치 할 수 있습니다.

컨테이너 클래스 내에서 요소가 사용되는 코드입니다. 부트 스트랩에서 div를 센터링하는 3 가지 방법 중 하나. 새로운 부트 스트랩으로 col-md-1, col-md-8 등과 같은 클래스 이름을 사용합니다. 부트 스트랩의 그리드 시스템을 읽어보십시오. 반응이 빠른 디자인을 위해 삶을 훨씬 더 편리하게 해줍니다.

<div class="container"> 
    <div class="row"> 
     <div class="col-md-1"></div> 
    </div> 
    <div class="container"> 
     <div class="col-md-8"> 
     <?php the_post(); ?> 
     <?php the_content(); ?> 
    </div> 
    <div class="col-md-2"> 
     <?php get_sidebar();?> 
    </div> 
    <div class="col-md-1"></div> 
</div>