부트스트렙 질문입니다.
본문
부트스트렙으로 뭘 해보려고 했더니...
참.. 어렵네요
선구자님들의 도움요청입니다.
부트스트렙에 보면 이미지를 반응형으로 크기에 따라서 줄여줄 수 있는데요..
폰트 크기도 반응하여 줄어들게 가능한가요??
가능하다면 어디 링크라도 좋으니 투척해주시면 감사하겠습니다.
답변 3
어차피 부트스트랩을 사용해도 어느정도 css는 추가해서 사용해야 합니다.
css 에 미디어쿼리를 코딩해준 후, 해상도 사이즈별로 font-size 넣어주면 됩니다.
참고하세요.
http://bootstrapk.com/css/#grid-media-queries
폰트크기는 안줄어요 ㅎㅎ
PC 버전 태블릿버전 모바일버전일때마다 다르게 보여줄라면
hidden-xs , visible-xs 클래스를 써보세요
무식하게 jqury로 하나 만들었습니다.
혹시 사용하실분은 참고 발바니다.
<script>
$( window ).resize(function() {
var width = $(window).width();
if ( width > 1170) {$("h1").css("font-size","36px"); $("h2").css("font-size","30px"); $("h3").css("font-size","24px"); $("h4").css("font-size","18px"); $("h5").css("font-size","14px"); $("h6").css("font-size","12px");
} else if (width <= 1170 && width >= 992) { $("h1").css("font-size","36px"); $("h2").css("font-size","30px"); $("h3").css("font-size","24px"); $("h4").css("font-size","18px"); $("h5").css("font-size","14px"); $("h6").css("font-size","12px");
} else if (width < 992 && width >= 768) { $("h1").css("font-size","28px"); $("h2").css("font-size","24px"); $("h3").css("font-size","22px"); $("h4").css("font-size","18px"); $("h5").css("font-size","14px"); $("h6").css("font-size","12px");
} else { $("h1").css("font-size","25px"); $("h2").css("font-size","20px"); $("h3").css("font-size","18px"); $("h4").css("font-size","16px"); $("h5").css("font-size","14px"); $("h6").css("font-size","12px");
}
});
</script>
답변을 작성하시기 전에 로그인 해주세요.