본문 table 선이 안나옵니다. css

본문 table 선이 안나옵니다. css

QA

본문 table 선이 안나옵니다. css

본문

/* 테이블 */
table.tstyle {
 border-collapse: collapse;
 width:100%;
 margin-top:15px;
 margin-bottom:30px;
 border-top: 2px solid #9f9f9f;
 
}
table.tstyle caption {
 text-indent: -2000px;
 margin: 0;
 padding: 0;
 font-size: 0;
 line-height: 0;
}
table.tstyle caption.view{
 text-indent:0;
 margin:0;
 padding:0 0 4px;
 font-size: 1em;
 line-height:150%;
}
table.tstyle th, table.tstyle td {
 padding: 10px 6px;
 line-height:140%;
}
table.tstyle th, table.tstyle td.bt {
 border-top: 2px solid #9f9f9f;
 font-size:14px;
}
 
table.tstyle th {
 background-color: #F4F4F4;
 font-weight: 600;
 color: #555555;
 text-align: center;
 vertical-align: middle;
 letter-spacing:-0.1em;
 border: 1px solid #dddddd;
}
table.tstyle th.rpth {
 background-color: #f6afaf;
 font-weight: bold;
 color: #555555;
 text-align: center;
 vertical-align: middle;
 letter-spacing:-0.1em;
 border: 1px solid #cadbdc;
}
table.tstyle td {
 background: #fff;
 border-bottom: 1px solid #cccccc;
    border-left: 1px solid #dddddd;
    border-right: 1px solid #dddddd;
}
table.tstyle td.st{
 background: #fff;
 border: 1px solid #cccccc;
 padding-left: 22px;
}
table.tstyle td.line_bno {
 background: #fff;
 border-right: 1px solid #cccccc;
 border-left: 1px solid #cccccc;
 border-top: 1px solid #cccccc;
 border-bottom: 1px solid #ffffff;
}
table.tstyle tfoot td {
 background: #f8f8f8;
 font-weight: normal;
 vertical-align: middle;
 color:#444;
}
table.tstyle td.item {
 background: #f8f8f8;
 color:#444;
}
table.tstyle td.bg {
 background: #f8f8f8;
}
table.tstyle td input.box {
 border:1px solid #cdcdcd;
 background:#fff;
 height:16px;
 margin-bottom:2px;
 vertical-align:middle;
}
table.tstyle td.pptd {
 background: #ffe4e4;
 border: 1px solid #cccccc;
 font-weight: bold;
}

table.tstyle2 {
 border-collapse: collapse;
 width:100%;
 margin:0.3em 0 0.5em 0;
 border-top: 2px solid #B0C361;

}
table.tstyle2 caption {
 text-indent: -2000px;
 margin: 0;
 padding: 0;
 font-size: 0;
 line-height: 0;
}
table.tstyle2 caption.view{
 text-indent:0;
 margin:0;
 padding:0 0 4px;
 font-size: 1em;
 line-height:150%;
}
table.tstyle2 th, table.tstyle2 td {
 padding: 5px 6px 3px 6px;
 line-height:140%;
}
table.tstyle2 th {
 background-color: #F4F4F4;
 font-weight: bold;
 color: #555555;
 text-align: center;
 vertical-align: middle;
 letter-spacing:-0.1em;
 border: 1px solid #cadbdc;
}
table.tstyle2 td {
 background: #fff;
 border: 1px solid #cccccc;
}
table.tstyle2 tfoot td {
 background: #f8f8f8;
 font-weight: normal;
 vertical-align: middle;
 color:#444;
}
table.tstyle2 td.item {
 background: #f8f8f8;
 color:#444;
 letter-spacing:-0.1em;
}
table.tstyle2 td.bg {
 background: #f8f8f8;
}

/* td 패딩값 */
table.t_pad th, table.t_pad td{
 padding: 5px 1px 3px;
}
table.t_pad .s_width{
 width:19px;
}
table.tstyle2 td input.box {
 border:1px solid #cdcdcd;
 background:#fff;
 height:16px;
 margin-bottom:2px;
 vertical-align:middle;
}
table caption {position:absolute; width:0; height:0; font-size:0; overflow:hidden; visibility:hidden;}


 

기존에 이렇게 되어있는데 색을 바꿔도 안나오고.. 그냥 선만 없는 표로 나오네요.

도와주세요 ㅠㅠ

아 그리고 table.tstyle 같이 선언되어 있는거는 뭐죠? table의 id? class?를 말하는 건가요?

이 질문에 댓글 쓰기 :

답변 3

table.tstyle 은

table엘리먼트중 class가 tstyle인 것들만 적용한다는 의미이고

색이 적용된 위치를 찾기는 f12클릭 후 

 

2000769928_1557734101.0536.png

를 누르신뒤 테이블을 클릭하면

 

2000769928_1557734128.4006.png

이런식으로 적용된 css를 확인하실 수 있습니다.

래느노이페 님 말씀처럼 F12누르셔서 개발자 도구에서 (2번째 사진) 직접 변경해보셔도 됩니다. 

 

실제 소스에 적용되는것이 아닌 크롬상태에서만 변경되서 보여지는것이니 체크 해보시고 그대로 적용하시면 됩니다. 굳이 table class="tstyle" 이런걸 넣지 않으셔도 됩니다.

 

뭐 편하게 하시려면 넣으시는편이 나중을 위해 좋긴 하지만요.. :)

답변을 작성하시기 전에 로그인 해주세요.
전체 0 | RSS
QA 내용 검색
  • 개별 목록 구성 제목 답변작성자조회작성일
  • 질문이 없습니다.

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT