>

나는 슈퍼, 슈퍼 멍청한 놈이며 당신의 도움이 필요합니다.
내가 달성하려고하는 것은 열에서 약간 유연한 레이아웃이지만 여전히 아래 그림과 같이 행마다 다른 색상으로 3 개의 행이 있습니다. 3 행과 1 행을 시도했지만 차이는 없습니다.
좋아, 9 열이 있고 각 열에는 4 개의 공백이 필요합니다. 그리고 가운데 그림을 녹색 줄에서 분홍색으로 가운데 열로 옮기려고했습니다. 해결되지 않았지만 다른 사진은 엉망이되었습니다. .clearfix도 시도했습니다.
여러분, 사람들을 도울 수 있기를 바랍니다!

  • 답변 # 1

    당신이 달성하려고하는 것은 벽돌 레이아웃입니다.

    rows 로 레이아웃을 배포 할 수 없습니다 columns 를 사용하여해야합니다. .

    모든 것이 .row 안에 있어야합니다  div에 필요한 열 수를 갖습니다 (이미지의 경우 .col-md-4 를 사용해야합니다) ).

    그런 다음 자바 스크립트 나 사용중인 기술을 사용하여이 세 열에 모든 것을 동적으로 추가해야합니다 (PHP 등에서도 달성 할 수 있습니다. 도움이 필요하면 편집하겠습니다).

    또한, 부트 스트랩 4를 사용하는 것이 좋습니다. Cards Columns라는 새로운 기능이 포함되어 있습니다.

    https://v4-alpha.getbootstrap.com/components/card/#card-columns

  • 답변 # 2

    부츠 탭은이를 달성하기 위해 다른 클래스를 가지고 있습니다.

    기본적으로

    <div class="row">
    
    

    그리고

    <div class="col">
    
    

    행 클래스는 행을 정의하고 col 클래스는 열을 정의합니다. col-1, col-2, col-3으로 열을 예를 들어 col-12까지 지정합니다. col 크기를 정의하지 않으면 col-12 크기보다 많은 공간을 자동으로 채 웁니다.

    요소 내부의 텍스트 배치 등과 같이 동작을 변경하는 많은 중첩 클래스가 있습니다.

    이 행과 열 시스템도 완벽하게 반응합니다.

    여기에서 자세히 알아보십시오.

    부트 스트랩 행과 열을 사용하여 원하는 결과를 얻을 수없는 경우, 대신 flexbox를 사용해보십시오. 자세한 정보는 여기에 있습니다.

  • 답변 # 3

    위쪽 위치에 탐색 모음을 사용할 수 있지만 부트 스트랩은 열을 행으로 나누는 클래스를 제공하지 않고 행을 열로만 나누는 클래스를 제공합니다 .html CSS를 사용해야합니다 jquery here.

  • 이전 ios - 스크롤보기가 효과적으로 작동하기 위해 적절한 제약 조건을 정의하는 방법
  • 다음 ftp - 하나의 URL에서 SPA와 함께 정적 웹 사이트를 제공하는 방법