示例地址：https://codepen.io/madarsbiss/pen/ExvYBwB
九、图片标签（Picture Tag）有时候需要在不同的分辨率下显示不同的图片，如果你使用<img> 标签的话，你需要做的工作就会许多，但是使用<picture> 标签就能很轻松的完成在不同分辨率下显示不同图片的设置，调整浏览器的大小，就会根据窗口的大小显示不同大小的图片，示例效果如下所示：
示例地址：https://codepen.io/madarsbiss/pen/abybomY
十、进度条（Progress Bar）
进度条组件也是个很常见的组件，你可以使用<progress> 标签就能轻松完成相关外观的设置，示例效果如下：
示例地址：https://codepen.io/madarsbiss/pen/oNevKdp
十一、下拉组件（Dropdown）如果下拉组件选项比较多，用户选择就会比较困难，用户可能希望结合输入，能很方便的定位到下拉组件的内容，这时候你可以使用 <datalist> 标签就能满足上述需求，示例效果如下所示：
示例地址：https://codepen.io/madarsbiss/pen/eYEOwdQ
十二、提示框（Tooltip）如果你需要对页面某部分进行详细介绍时，你可能需要鼠标经过此区域显示详细的提示框效果，这时我们可以使用 title 属性就能轻松实现，示例效果如下所示：
