项目中使用marquee标签制作走马灯效果的信息公告,遇到一个尴尬的问题,点击走马灯会出现黑色边框并且点击文字会出现鼠标闪烁现象,网上搜索半天也没找到有效解决方案,特此记录一下针对这一问题做出的解决修改方案。
HTML:
<marquee class="marquee" behavior="scroll" contenteditable="true" size="3" scrollamount="15" width="100%">
<div class="msg_">
<img src="../assets/images/msg_icon.png" alt=""class="msg_icon" >
<span style="height:25px;display: inline-block;vertical-align: middle">{{message?message:'暂无通知信息!'}}</span>
</div>
</marquee >
CSS:
.marquee,.marquee:active,.marquee:visited{
outline: none!important;
pointer-events: none!important;
}