實現公告或其他字體寬度不夠自動隱藏用...代替的方法

<p>
                    <a href="#">最新公告：&nbsp; &nbsp;
                        <span class="hidden-sm hidden-xs">2017-2-20 &nbsp; &nbsp;</span>
                        <span class="notice-content">
            元旦期間的業務公告即受理公告元旦期間的業務公告即受理公告
                        </span>
                    </a>
                </p>

a{
            display: inline-block; //默認爲行內無法定寬
            color: #aaa;
            width: 60%; //定寬才能讓超出隱藏執行
            text-overflow: ellipsis; //讓文本超出容器顯示爲...
            overflow: hidden; //讓內部超出隱藏
            white-space: nowrap;//關閉文本自動換行
            span.notice-content{
              color: #666;

            }

幾種屬性一起施加才能達到這種效果