主页 / 问题 / 690564
Accepted
Black Fire
Asked:2020-07-11 00:33:39 +0000 UTC2020-07-11 00:33:39 +0000 UTC

从 html 中删除标签

  • 772

有一个带有文本的块，其中在某些地方有一个 br。使用较小的窗口宽度，文本呈现出无法呈现的外观，并且不会与块宽度的文本对齐对齐。也许有一种方法可以在特定窗口宽度下从块中删除 br 标签？

html

2 个回答

  1. 媒体查询将帮助您解决这个问题：

    @media only screen and (max-width: 500px) {
  br {
    display: none;
  }
  .text {
    text-align:justify;
  }
}
    <div class="text">
  Lorem ipsum dolor sit amet, consectetur<br />adipiscing elit, sed do eiusmod tempor incididunt ut labore et<br />dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris<br />nisi ut aliquip ex ea commodo consequat.<br
  />Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident,<br />sunt in culpa qui officia deserunt mollit anim id<br />est laborum. Sed ut perspiciatis, unde
  omnis iste natus error sit voluptatem<br />accusantium doloremque laudantium, totam<br />rem aperiam eaque ipsa, quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt, explicabo. Nemo enim ipsam<br />voluptatem, quia voluptas
  sit, aspernatur aut odit aut fugit,<br />sed quia consequuntur magni dolores eos, qui ratione voluptatem sequi nesciunt, neque porro quisquam est, qui dolorem ipsum, quia dolor<br />sit, amet, consectetur, adipisci velit, sed quia non numquam eius modi
  tempora incidunt, ut labore et dolore magnam aliquam quaerat voluptatem.
</div>

    • 2
  2. Best Answer

    例如，这就是您可以仅针对特定屏幕宽度半径隐藏“br”标签的方法。在 750px 及以下的示例中，标签从具有“parent-block”类的块中删除。jQuery 是脚本运行所必需的。

    var w = screen.width;

function forMobile() {
    w = screen.width;
    if (w <= 750) {
        $('.parent-block').find('br').css('display', 'none');
    } else {
        $('.parent-block').find('br').css('display', 'block');
    }
}
forMobile();

$( window ).resize(function() {
    forMobile();
});

    这是CSS

    @media screen and (max-width: 750px) {
   .parent-block br {
      display: none;
   }
}

    我习惯于创建有时会做类似事情的 js 插件，这里有一个例子。js脚本和css做同样的事情。

    • -1

相关问题