change font size on large screen resolution bootstrap

Solutions on MaxInterview for change font size on large screen resolution bootstrap by the best coders in the world

showing results for - "change font size on large screen resolution bootstrap"
Violette
05 Jul 2018
1/* 
2Extra small devices (portrait phones, less than 544px) 
3No media query since this is the default in Bootstrap because it is "mobile first"
4*/
5h1 {font-size:1rem;} /*1rem = 16px*/
6/*
7####################################################
8M E D I A  Q U E R I E S
9####################################################
10*/
11 
12/*
13::::::::::::::::::::::::::::::::::::::::::::::::::::
14Bootstrap 4 breakpoints
15*/
16/* Small devices (landscape phones, 544px and up) */
17@media (min-width: 544px) {  
18  h1 {font-size:1.5rem;} /*1rem = 16px*/
19}
20 
21/* Medium devices (tablets, 768px and up) The navbar toggle appears at this breakpoint */
22@media (min-width: 768px) {  
23  h1 {font-size:2rem;} /*1rem = 16px*/
24}
25 
26/* Large devices (desktops, 992px and up) */
27@media (min-width: 992px) { 
28  h1 {font-size:2.5rem;} /*1rem = 16px*/
29}
30 
31/* Extra large devices (large desktops, 1200px and up) */
32@media (min-width: 1200px) {  
33  h1 {font-size:3rem;} /*1rem = 16px*/    
34}
35 
36/*
37::::::::::::::::::::::::::::::::::::::::::::::::::::
38Custom media queries
39*/
40 
41/* Set width to make card deck cards 100% width */
42@media (min-width: 950px) and (max-width:1100px) { 
43  h1 {font-size:2.75rem;color:red;} 
44}