If you want a cool transition on your font-size when the user resizes the browser this is how you might do it using Bootstrap3. If your using LESS with Bootstrap (if your not, you should be!) 😛 All you do is simply call the transition LESS mixin function with your params, adjust the seconds.
|
1 2 3 |
.transition(font-size .15s linear); |
So for responsive heading h1 you could do the following.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 |
// RESPONSIVE TYPOGRAPHY /* ONLY Small devices (768px and down) */ @media (max-width: @screen-sm-max) { } /* Small devices (tablets, 768px and up) */ @media (min-width: @screen-sm-min) { h1.page-title { font-size: 60px; font-weight: 900; line-height: 1em; .transition(font-size .15s linear); } } /* Medium devices (desktops, 992px and up) */ @media (min-width: @screen-md-min) { h1.page-title { font-size: 90px; } } /* Large devices (large desktops, 1200px and up) */ @media (min-width: @screen-lg-min) { } |
I see you don’t monetize your website, don’t waste your traffic, you can earn additional bucks every month because you’ve got high quality content.
If you want to know how to make extra $$$, search for: best adsense alternative
Wrastain’s tools