[TOC]
# 響應式+固定寬高比例
使用 `padding-top/padding-bottom` 來代替 `height`屬性了.比如你想要讓元素的按在 4:3 的比例顯示, `width` 設置成了30%,那么 `padding-top/padding-bottom` 只需要設置成為 40%就可以了.同時把 `height` 設為0:
```css
.img-3-4 {
margin: 10px;
padding-bottom: 30%;
width: 40%;
height: 0;
background-color: #dbe0e4;
}
```
## Refs
來源：https://www.jianshu.com/p/56a3adebdb01
- 必備基礎
- 基礎知識
- BFC
- 層疊上下文 Stacking Context
- 視覺格式化模型 Visual formatting model
- CSS3中使用HSL顏色指南
- z-index
- line-height
- vertical-align 屬性
- 垂直居中
- overflow
- CSS3 Gradients
- CSS3 動畫基礎
- 難點知識
- 布局篇
- Flex布局
- =====
- Grid布局
- 多列布局
- 高級布局
- 預編譯器篇
- PostCSS
- Sass
- stylus
- 模塊篇
- 良好的使用
- CSS 模塊化
- 技巧篇
- 未來的CSS
- 動畫篇
- 工具篇
- CSS架構
- CSS 命名方法論
- BEM
- CSS解釋器
- 常用框架
- 參考
- 唰唰聲