본문 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클릭 후
를 누르신뒤 테이블을 클릭하면
이런식으로 적용된 css를 확인하실 수 있습니다.
적어놓으신 소스만 봐선 안 나올 이유가 없어 보이는데,
아무래도 다른 곳의 영향을 받고 있는 듯 하네요.
래느노이페 님 말씀처럼 F12누르셔서 개발자 도구에서 (2번째 사진) 직접 변경해보셔도 됩니다.
실제 소스에 적용되는것이 아닌 크롬상태에서만 변경되서 보여지는것이니 체크 해보시고 그대로 적용하시면 됩니다. 굳이 table class="tstyle" 이런걸 넣지 않으셔도 됩니다.
뭐 편하게 하시려면 넣으시는편이 나중을 위해 좋긴 하지만요.. :)