h5-app에 대한 css 스타일

3836 단어 h5
일부 프로젝트에서 만났던 css 양식을 정리하여 나중에 찾아보고 지속적으로 업데이트할 수 있도록 합니다.
1. 텍스트가 지정된 줄 수로 표시되도록 제어하고 나머지 부분은 생략 부호로 대체한다.
.singleline{
    display: -webkit-box;       /*  , */
    -webkit-box-orient;         /*  , */
    text-overflow: ellipsis;    /* , “…” */
    overflow : hidden;
    -webkit-line-clamp: 1;      /* 
    -webkit-box-orient: vertical;
}

2. 아이콘 오른쪽 상단에 수량 알림을 표시합니다. 위챗에서 메시지를 읽지 않은 것과 같습니다.
.redpoint{ 
    height: 15px;width: 15px;
    border-radius: 50%;
    display: inline-block;
    text-align: center;
    font-size: 0.1em;
    color: #FFFFD0; /* */
    background: red;
    position: relative;
    top: -38px;    /* */
    right: -10px;
}

3. 원각 카드(주배경은 흰색, 원각 카드는 회색)
.card-back{
    background-color:#f0f0f0;
    border-radius:10px;     /* */
}

4. 모든 요소 공통 스타일(*로 식별)
*{
    font-family:Arial;      /* */
}

5. 원소를 특립하고 모든 원소의 공용 스타일을 사용하지 않는다(예를 들어 모두가 빨간색이고 나만 파란색이다)
*{
    color:red;
}
.mycss{
    colorable !important;   /*!important */
}

좋은 웹페이지 즐겨찾기