How to write the bootstrap media queries for very large screens ?
Bootstrap: It is a free open source CSS framework that is used to build responsive websites i.e., the UI will not distort irrespective of the resolution of the screen size. It might be an iPad, tablet, mobile, or any other device the website functions in a smooth way. In order to achieve this objective, we can use the in-built classes of the framework and we can also customize the class properties using media queries. Below there is a table that enumerates all the media query breakpoints.
Device Type min-width in px Small Devices like mobiles 576px Medium Devices like tablets 768px Large devices like Desktops 992px Very large or Extra large devices like large desktops 1200px
Example: The following example uses media queries and will add a property for background-color for very large screens.
Observation: If the screen size is more than 1200px then the background-color is the above one and if the resolution is less then 1200px then its background-color will be none.
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML course.