Javascript cssdiv容器显示更多内容

我有一个包含以下内容的div容器：

    <div class="myBtn" tabindex="0">

    Line 1

    Line 2

  </div>

现在我想补充一点，div只在“小模式”中显示第1行和第2行 在较大模式下，1号线和2号线

---

我还想补充一点，div中图像的大小会随着大小的变化而变化，根据高度的变化隐藏/显示内容不是一个好主意

相反，将隐藏内容的默认显示设置为

none

，然后在某些条件下将其修改为所需的显示样式

例如：

.line2{
    display: none;
}
.parent:hover .line2{
    display: inline;
}

以及HTML：

<div class="parent">
    <div class="line1">some content</div>
    <div class="line2">some more content</div>
</div>

一些内容
更多内容

这里的小模式是什么意思？

<div class="parent">
    <div class="line1">some content</div>
    <div class="line2">some more content</div>
</div>