부트스트랩5 알파에 '그리드 레이아웃'이 없다.

이 블로그가 아닌 다른 티스토리 블로그를 부트스트랩4로 만들었다. 부트스트랩4가 적용된 그 블로그에 부트스트랩5 알파의 CSS와 자바스크립트를 그대로 적용해서 얼마나 변했는지 확인해 본다. 몇 년 전 부트스트랩4가 나왔을 때도 부트스트랩3으로 만든 이 블로그를 부트스트랩4를 적용한 적이 있다. 

 

그래서 부트스트랩4로 만든 티스토리 블로그에 5 알파의 CSS와 자바스크립트를 적용했다. 적용 결과 시간을 들여 전체적으로 봐야 하지만 대부분 크게 눈에 띄가 다르게 보이는 것은 없었다. 내 블로그에서 눈에 뛴게 없었다는 것이다. 예로 아래와 같은 캐러셀은 변화가 없었다. 참고로 부트스트랩3에서 그리드가 변해 캐러셀을 변화가 많았다.

바로 눈에 띄는 부분은 커버의 card grid 와 링크 부분이었다. 그래서 부트스트랩5 알파의 card 부분을 살펴봤더니 내가 4에서 적용시켰던 cards grid가 5 알파에서는 없는 것을 확인했다. 그러니 커버에 grid card 부분이 제대로 나오지 않은 것이었다.

cards grid는 벽돌 모양으로 쌓는 레이아웃으로 이 블로그의 커버에서도 볼 수 있다. 예로 아래에서 볼 수 있는 카드를 그리드로 만드는 레이아웃이 부트스트랩5 알파에서 볼 수 없었다. 참고로 아래 card grid는 부트스트랩4에서만 지원하는 것이다. 

부트스트랩3로 만든 이 블로그에서 그리드 레이아웃을 어떻게 적용했는지는 아래 글에서 알 수 있다. 사람들이 그리드 레이아웃을 많이 사용하니 부트스트랩4에 집어 넣은 모양이다. 

벽돌리스트인 Masonry 레이아웃 구현하기

그리고 부트스트랩5 알파를 보니 자바스크립트에 2,3,4에서 볼 수 있었던 jQurey를 빼 버리고 가볍게 가는 것 같다. jQuery는 벽돌 레이아웃을 구현하기 위해 필요한 것 같다. 

 

---

 

• 부트스트랩으로 디자인하라:싱글 웹 페이지 & 반응형 웹사이트 쾌속 개발
• AngularJS와 부트스트랩으로 배우는 웹 개발
• 부트스트랩 사이트 디자인:원페이지 사이트를 구축하는 가장 신속하고 효과적인 방법