您的按钮不会仅使用HTML进行神奇缩放.所以你有两个选择.
选项#1:重复
这个是最丑陋的,但它不符合您的需求,因为它不需要额外的媒体查询:
Home
Home
Home
Download
Download
Download
选项#2:媒体查询
而且……最后.这是执行此操作的正确方法.
Home
Download
.btn-autosize {
padding: 1px 5px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}
@media screen and (min-width: 768px) {
.btn-autosize {
padding: 5px 10px;
font-size: 12px;
line-height: 1.5;
border-radius: 3px;
}
}
@media screen and (min-width: 992px) {
.btn-autosize {
padding: 10px 16px;
font-size: 18px;
line-height: 1.33;
border-radius: 6px;
}
}