HTML循环滚动公告栏是一个网页中常用的功能，可以显示最新的信息，并吸引用户的注意。下面是一个示例代码：

<p ><ul><li>这是第一条公告</li><li>这是第二条公告</li><li>这是第三条公告</li><li>这是第四条公告</li></ul></p><style>.scroll{height: 30px;overflow: hidden;}.scroll ul{padding-left:0;margin-left:30px;list-style:none;animation: marquee 15s linear infinite;}@keyframes marquee {0% {transform: translateX(0);}100% {transform: translateX(-100%);}}</style>

上述代码中，通过使用CSS3的animation属性实现了循环滚动效果。其中，scroll类设置了高度和隐藏溢出，ul标签设置了padding、margin和无序列表，marquee设置了动画的关键帧。

另外，为了让公告栏更加美观，可以使用CSS去美化它，例如修改字体、背景色、字体颜色等等。此外，可以使用JavaScript动态添加公告，使其更加灵活和自动化。

总之，HTML循环滚动公告栏是一个非常重要的网页UI设计元素，有助于提升用户体验和网站的吸引力。