twitter-bootstrap – 按引导顺序调整大小按钮

发布时间：2020-12-18 00:15:26 所属栏目：安全来源：网络整理

导读：我使用引导，CSS是响应的，所以它在较小的设备上很好地缩放。但是，当视口较小(例如，在移动设备上)时，我希望按钮缩

我使用引导，CSS是响应的，所以它在较小的设备上很好地缩放。但是，当视口较小(例如，在移动设备上)时，我希望按钮缩小。

<button name="button" type="submit" id="edit_button-46" class="btn btn-default" value="edit" >Edit</button>

基本上，在较小的设备上，类btn-xs应该添加到所有按钮。

我可以通过Jquery完成此任务，但是想知道bootstrap是否已经具有此功能？

解决方法

您可以使用CSS @media查询来相应缩放按钮。

@media (max-width: 768px) {
  .btn-responsive {
    padding:2px 4px;
    font-size:80%;
    line-height: 1;
  }
}

@media (min-width: 769px) and (max-width: 992px) {
  .btn-responsive {
    padding:4px 9px;
    font-size:90%;
    line-height: 1.2;
  }
}

演示：http://bootply.com/93706

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!