这里的公告是要做成，跑马灯的样式，文字是会移动并且隐藏掉的。
 

HTML：

<div class="notice">
				<div class="yrr">
					<img src="./img/ia_100000018.png" alt="" />
				</div>
				<div class="orr">
					<div class="arr">新乡市企业家联合会是由新乡市区域内的企业家自愿
					加入而组成的，在主管单位新乡市工业和信息化局、登记管理机关新乡市民
					政局的指导和监督管理下开展活动的地方性、联合性、非营利性社会团体组
					织。本会以为企业家服务为宗旨，维护企业家的合法权益，为企业家的成长发
					展创造优良环境;促进企业家守法、自律，开展企业家诚信建设、信用建设、
					自律建设活动;发挥企业家与政府之间的桥梁纽带作用，协调企业家与企业
					、企业家与社会、企业家与劳动者的关系;引导广大企业家爱党、爱国、爱人
					民，为推动新乡市经济社会高质量发展贡献力量。</div>
				</div>
				
			</div>

CSS：
 

/* 公告 */
.notice {
	display: flex;
	justify-content: space-evenly;
	align-items: center;
	width: 90%;
	height: 80px;
	margin-left: 5%;
	background-color: white;
	position: absolute;
	top: 350px;
	opacity: 0.65;
	border-radius: 10px;
	overflow: hidden;
}
.yrr{
	height: 30px;
}
.yrr img {
	padding-left: 10px;
	width: 30px;
	height: 30px;
}

.orr{
	overflow: hidden;
}
.arr{
	width: 220px;
	padding-left: 10px;
	white-space: nowrap;
}

JS:

/* // 获取要展示的元素 */
let arr = document.getElementsByClassName("arr")[0];

/* // 设置初始位置为0px */
let position = 0;

function moveText() {
	/* // 将当前位置向左移动1像素 */
	position -= 1;

	/* // 如果已经到达最右边界，则重新开始从左侧开始 */
	if (position < -arr.scrollWidth) {
		position = 0;
	}

	/* // 更新元素的位置 */
	arr.style.transform = "translateX(" + position + "px)";
}

/* // 每50ms调用moveText函数一次 */
setInterval(moveText, 20);

希望能帮助到您~~