自訂 select 樣式

參考這篇文章

css的重點:如何把預設下拉選單樣式移除?

appearance:none;
-moz-appearance:none;
-webkit-appearance:none;

移除後,用自訂背景的方式放自己做的箭頭圖

IE要另外

::-ms-expand {
display: none;
}

被選取的狀態調整
:focus{
box-shadow: 0 0 5px 2px #467BF4;
}

響應式圖片(Responsive Images)作法

參考文章:https://cythilya.github.io/2018/08/24/responsive-images/

google 的文章:https://support.google.com/webmasters/answer/114016?hl=zh-Hant

最基本的用法
<img src=”small.jpg”
srcset=”small.jpg 640w, medium.jpg 960w, large.jpg 1024w”
/>

裡面的640w,960w,1024w,就是
螢幕寬度640px時,顯示small.jpg
螢幕寬度960px時,顯示medium.jpg
螢幕寬度1024px時,顯示large.jpg