首页 > 解决方案 > 仅为移动设备添加课程

问题描述

我只想p-5为移动环境添加类。

电脑用

<nav class="navbar navbar-expand-lg navbar-light bg-light" style="padding:0px 10px 0px 10px;">

用于手机

<nav class="navbar navbar-expand-lg navbar-light bg-light p-5" style="padding:0px 10px 0px 10px;">

我知道有类似切换 css 的东西

@media screen and (min-width: 768px) {

但是类p-5对我来说是黑盒,因为它是引导程序默认类。

那我该怎么做呢??

标签: htmlcss

解决方案


我不相信你可以单独使用 CSS 添加类。您理论上可以使用媒体屏幕并更改课程的属性,这也可以。你可以使用 jQuery 轻松地做你想做的事。一种方法是像这样附加调整大小事件:

$(window).on('resize', function() {
  if($(window).height() > 768px) {
    $('.navbar').removeClass('p-5');
  }else{
    $('.navbar').addClass('p-5');
  }
})

推荐阅读