티스토리 뷰



CSS에서 수정 된 곳
/* cate */
.cate {}
.cate .tt_category {}
.cate .tt_category .link_tit {display: none} /* 분류 전체 보기 */
.cate .tt_category .category_list {overflow: hidden;}
.cate .tt_category .category_list li {
    position:relative; 
    float: left; 
    width: 25%; height: 500px; 
    background:#ccc; cursor:pointer; 
}
.cate .tt_category .category_list li:before {
    content:''; 
    width: 100%; 
    height: 100%; 
    background:rgba(0,0,0,0.7); 
    position:absolute; left: 0; top:0; 
    z-index:1;
}

.cate .tt_category .category_list li .link_item {
    color:#fff; 
    z-index:10; 
    position: relative; 
    width: 100%; height: 100%; 
    display: block; 
    padding: 55px 45px; 
    box-sizing:border-box; 
    font-size:16px;
}
.cate .tt_category .category_list li .link_item:before {
    position:absolute; top:40px; left:45px; 
    font-size:10px;
}
.cate .tt_category .category_list li .link_item:after {
    content:'VIEW'; 
    border: 1px solid #fff; 
    position: absolute; bottom: 40px; left: 40px; 
    font-size: 12px; 
    padding: 3px 12px;
}
.cate .tt_category .category_list li:nth-child(1) {background:url(./images/cate1.jpg) center; background-size: cover; }
.cate .tt_category .category_list li:nth-child(2) {background:url(./images/cate2.jpg) center; background-size: cover;}
.cate .tt_category .category_list li:nth-child(3) {background:url(./images/cate3.jpg) center; background-size: cover;}
.cate .tt_category .category_list li:nth-child(4) {background:url(./images/cate4.jpg) center; background-size: cover;}
.cate .tt_category .category_list li:nth-child(5) {background:url(./images/cate4.jpg) center; background-size: cover;}
.cate .tt_category .category_list li:nth-child(6) {background:url(./images/cate4.jpg) center; background-size: cover;}
.cate .tt_category .category_list li:nth-child(7) {background:url(./images/cate4.jpg) center; background-size: cover;}
.cate .tt_category .category_list li:nth-child(8) {background:url(./images/cate4.jpg) center; background-size: cover;}

.cate .tt_category .category_list li:nth-child(1) .link_item:before {content:'01';}
.cate .tt_category .category_list li:nth-child(2) .link_item:before {content:'02';}
.cate .tt_category .category_list li:nth-child(3) .link_item:before {content:'03';}
.cate .tt_category .category_list li:nth-child(4) .link_item:before {content:'04';}
.cate .tt_category .category_list li:nth-child(5) .link_item:before {content:'05';}
.cate .tt_category .category_list li:nth-child(6) .link_item:before {content:'06';}
.cate .tt_category .category_list li:nth-child(7) .link_item:before {content:'07';}
.cate .tt_category .category_list li:nth-child(8) .link_item:before {content:'08';}
  • 네이버 블러그 공유하기
  • 페이스북 공유하기
  • 트위터 공유하기
  • 트위터 공유하기
  • 트위터 공유하기
댓글
댓글쓰기 폼