Being new to web design, I have a question about creating a webpage with a large image in the center like on GitHub's Windows page. How can I work with the image inside that particular div or area based on different screen sizes? Is it possible to make images resize or get cut off depending on window or screen size? Would using media queries be the standard practice to adjust the image based on the device being used? How can this be achieved in CSS - is it possible to change the image source directly within the CSS for the img tag? Do I need to constantly check and resize the image using a JavaScript event related to window resizing similar to how it's done in masonry layouts?
I know these are multiple questions (apologies) but I am seeking advice on the best practices as I am still new to this...
Your input is greatly appreciated!