求解
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0,user-scalable=no">
<title>移动端</title>
<style>
img {display: block; max-width: 100%;
}
</style>
</head>
<body>
<img src="img/tour1.jpg" alt="">
</body>
</html>
img標籤是行內元素，行內元素是沒有width和height屬性，自然無法設定。需要設定成block，才可以設定。但是img標籤比較特殊，跟input又叫替換元素，自身就有width和height，所有隻是為了設定width和height，改變display為block是沒有必要的。畫蛇添足而已
因為img標籤預設是行內元素（好像是這麼說的），也就是inline，行內元素設定寬度是無效的，display: block; 之後為區塊級元素。設定了width才有效
為何不用flex版面呢?
不需要啊，直接width=100%，就可以呀，前提要有 行動端的 meta 標籤
解決圖片常見問題---底部多餘留白
設定img為：
display:block;