Bootstrap4において、class="d-none d-md-block" のような形で、指定サイズ以上であれば表示する、という表現があるかと思います。
これの、指定サイズ「以下」であれば表示する、という方法を探しております。

用途として次のようなことをしております。

<p>あいうえお例文 <span class="nobr">あああああああああああああああああああああああ</span> あいうえお例文あいうえお例文あいうえお例文</p>

この時、.nobr*.nobr{white-space:nowrap;} としており、改行をさせたくない部分に適応しております。
しかし、想定以上に長いものに関しては、スマートフォンの場合横にあふれてしまうため、

<p>あいうえお例文
<span class="nobr">ああああああああああああ<br class="d-none d-md-block" />あああああああああああ</span>
あいうえお例文あいうえお例文あいうえお例文</p>

のような形で、スマートフォンサイズなら、ここで改行を発生させる、というようにしたいと思っております。
例えば、試していませんがメディアサイズによって異なるよう

@media (min-width: 900px) {
    .mb-only{display:none;}
}
@media (max-width: 380px) {
    .mb-only{display:inline;}
}

にして、<br class="d-none d-md-block">を、<br class="mb-only" />のようにすれば出来なくもないかと思うのですが、Bootstrap4に何か書き方があれば、そちらの書き方を使いたいと思っております。

よろしくお願いします。