如何使用CSS在边框上显示文本

时间:2019-02-15 09:34:41

标签: html css

我正在使用以下设计建议创建HTML和CSS: design

但是我的结果是:

my html

HTML代码:

<div className="project_content">
  <div className="project_quick f_bold" id="tab">
    <a><span>업데이트</span><span className="alral_num">1</span></a>
    <a><span>커뮤니티</span><span className="alral_num">34</span></a>
    <a><span>통계</span></a>
  </div>
</div>

CSS代码:

.alral_num {
    height: 20px;
    padding: 2px 7px 0 7px;
    margin: 0 0 0 5px;
    display: inline-block;
    background: #e8351d;
    border-radius: 15px;
    text-align: center;
    color: #fff;
    line-height: 1.2;
}
 .project_content .project_quick .alral_num {
    position:relative;
    width: 20px;
    display: table;
    left: 20%;
    margin-top: 5px;
}
 .project_quick a {
    height: 60px;
    padding: 20px 40px 20px;
    display: inline-block;
    font-size: 16px;
    background: url(../../assets/images/line01.gif) no-repeat right 50%;
}
 .project_quick a:last-child{
    background: none
}
 .f_bold {
    font-weight: 700 !important;
}

我想在边框上显示数字

我尝试过position:fixed,但是我必须垂直或水平滚动,滚动时应移动数字。所以没用。

0 个答案:

没有答案