Week 11: Day 3 of Work Experience at LIT
Week 11
Day 3 of Work Experience at LIT
I have been working on media queries for responsive design and figured out how to use them. As a template for this and future websites, I set the body background colour to correspond with the CSS3 media query. This makes figuring out the items that need to be adjusted within the media queries more efficient.
1. Screen-size: 1800px:
2. Screen-size: 1500px:
3. Screen-size: 1200px:
4. Screen-size: 960px:
5. Screen-size: 750px;
6. Screen-size: 540px:
7. Screen-size:
Day 3 of Work Experience at LIT
I have been working on media queries for responsive design and figured out how to use them. As a template for this and future websites, I set the body background colour to correspond with the CSS3 media query. This makes figuring out the items that need to be adjusted within the media queries more efficient.
These breakpoints are where the pixel change starts with a highlighting corresponding colour to differentiate.
These responsive pixel settings are for medium and smaller screens:
1. Screen-size: 1800px:
3. Screen-size: 1200px:
4. Screen-size: 960px:
5. Screen-size: 750px;
6. Screen-size: 540px:
7. Screen-size:
For larger screens:
Note: the above screens were recorded on a laptop 1800px screen
The next are from at 2700px screen.
8(a) 2100px:
8(b) 2400px:
Comments
Post a Comment