how to code a weather forecast web
Let's work through the example we saw at the beginning: the weather forecast. The first step is to make the forecast look good on a small screen. The app at a narrow width. Next, resize the browser until there is too much white space between the elements, and the forecast simply doesn't look as good. The decision is somewhat subjective, but above 600px is certainly too wide. The app at a point where we feel we should tweak the design. To insert a breakpoint at 600px , create two media queries at the end of your CSS for the component, one to use when the browser is 600px and below, and one for when it is wider than 600px . @media ( max-width : 600px ) { } @media ( min-width : 601px ) { } Finally, refactor the CSS. Inside the media query for a max-width of 600px , add the CSS which is only for small screens. Inside the media query for a min-width of 601px add CSS for larger screens. Pick minor breakpoints when necessary # In addition to choosing major breakp
Comments
Post a Comment