填充圖像並調整屏幕尺寸

Question

我試圖用圖像填充屏幕，並且圖像不會變形。我想做它不作爲背景圖像。我想用css來做 - 我知道這是可能的，但我沒有找到正確的代碼組合。

這是我所需要的圖片做一個例子：

http://kentmatheson.com/index-NEWNEW1.html

你可以看到圖像（S）充滿整個屏幕空間，無論是狹窄或者最寬尺寸的大小取決於在屏幕寬度上，並且不要扭曲圖像。這是偉大的，但不會爲我當前的設置，因爲CSS img衝突。

我已經得到了我想要使用的設置，在這裏：

http://kentmatheson.com/index-NEWNEW2.html

，但我無法找到的CSS代碼的正確組合，使其響應，因爲我想。如果我填充高度圖像扭曲，如果我填充到寬度圖像不會填滿屏幕...

感謝您的任何幫助。

Answer 1

我終於搞定了。
在這裏，你去！
祝你好運！

---

HTML

<img id="theimg" src="http://interfacelift.com/wallpaper/D7c82ceb/04087_riomaggioreatsunset_3840x2160.jpg"> 

---

CSS

#theimg { 
    width: 100%; 
    height: 100%!important; 
    object-fit: cover; 
    object-position: right; 
}