부트스트랩4 질문
본문
안녕하세요 부트스트랩4로 제작된 테마를 활용하여 홈페이지를 제작하고있는데
보통 <div class="row">
<div class="col-md-12>
등과 같이 그리드를 적용하는데요 마진값을 적용할 경우에도
<div class="row">
<div class="col-md-12 mt-5">
와 같이 만들어진 클래스를 활용하여 적용하는 경우가 많은데요
문제는 이렇게 pc쪽을잡고 반응형 모바일에서는 마진값(mt-5)을 적용하고 싶지 않을때
미디어 쿼리에 보통 어떻게 처리하시나요?
뭔가 심플한방법이 있을것 같은데 처리하기가 어렵네요.
답변 1
<div class="col-md-12 mt-0 mt-md-5">
이렇게해보세요
미디어쿼리와 함께 조금더 이해가쉽게 설명해 주시면 채택해 드리겠습니다.
mt-0 은 margin-top:0 이고
mt-md-5 는 @media (min-width: 992px){margin-top:3rem!}입니다.
두개를 같이 쓰면 기본적으로 margin-top이 0인데 넓이 992px이상에서만 3rem으로 적용되게 됩니다.
답변을 작성하시기 전에 로그인 해주세요.
