티스토리 뷰
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';}
댓글
- Total
- Today
- Yesterday