[css] 舉例說明你知道的css技巧有哪些？
/* 等比例容器 */
.ratio { position: relative; display: block; }
.ratio:before { content: ''; padding-top: 100%; float: left; }
.ratio::after { content: ''; display: block; clear: both; }
/* 非表單元素也適用的 disabled */
.disabled {
pointer-events: none;
user-select: none;
&.gray { filter: grayscale(1); }
}
/* 點擊 label 觸發隱藏的 file 表單 */
label.form-file {
position: relative;
overflow: hidden;
cursor: pointer;
vertical-align: middle;
& > input[type="file"] { position: absolute; left: -999em; }
}
/* 子元素之間輕松 10px 空隙 */
.gap-right-10 > :not(:last-child) {
margin-right: 10px;
}
個人簡介
我是歌謠，歡迎和大家一起交流前后端知識，放棄很容易，
但堅持一定很酷，歡迎大家一起討論
主目錄
與歌謠一起通關前端面試題
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/260080.html
標籤：其他