我有一个通知面板,其中显示最新的通知。但通知的内容取决于通知推送的内容。因此,这可能会从非常短的消息变化到较长的消息。短消息可以完美显示,但长消息现在无法正确显示。我将其编写为以下形式以使其看起来更好:
以下是我所说的HTML:
以下是我所说的HTML:
<div data-role="content" class="ui-content">
<ul data-role="listview">
<li id="notification-block">
<img class="notification_bell" src="img/icons/alert.png">
<div class="notification-wrapper">
<h2 class="notification-header"></h2>
<p class="notification-message"></p>
<p class="read-more">
<a href="#all" style="text-decoration: none" data-transition="slide">
Meer <span class="fa fa-angle-right carot"></span>
</a>
</p>
</div>
</li>
</ul>
</div>
以下是我如何动态设置通知消息内容的方法:
$(".notification-header").append(title);
$(".notification-message").append(message).first("p");
正如你在代码片段中看到的一样,它使用了溢出隐藏和省略号的方式。但是我想要的是将其高度调整并换行以便能够完全显示文本。
以下是重现的代码片段
notification-block
的垂直中心中垂直对齐notification-wrapper
,然后去掉margin: 60px 10px 5px 10px;
吗? - pttsky