Html 표 테두리 에서 완전히 제거 방법

Html 페이지 내 목표는, 사진, &quot frame&quot 비슷합니다. 즉, 4 둘러싸인 빈 페이지가 만들고 싶은 것이 특징이다.

이건 내 코드:

<table>
    <tr>
        <td class="bTop" colspan="3">
        </td>
    </tr>
    <tr>
        <td class="bLeft">
        </td>
        <td class="middle">
        </td>
        <td class="bRight">
        </td>
    </tr>
    <tr>
        <td class="bBottom" colspan="3">
        </td>
    </tr>                                                    
</table>

및 CSS 클래스뿐만 다음과 같습니다.

.bTop
{
    width: 960px;
    height: 111px;
    background-image: url('../Images/BackTop.jpg');
}
.bLeft
{
    width: 212px;
    height: 280px;
    background-image: url('../Images/BackLeft.jpg');    

}

.middle
{
    width: 536px;
    height: 280px;
}

.bRight
{
    width: 212px;
    height: 280px;
    background-image: url('../Images/BackRight.jpg');    
}

.bBottom
{        
    width: 960px;
    height: 111px;
    background-image: url('../Images/BackBottom.jpg');       
}

나는 내 문제는 국경 사이에 얇은 흰색 선이 가져오는 것은 아니다, 내가 테이블의 셀입니다 사진 횡단면도. 이러한 공백은 피할 수 있습니까?

Brian Tompsett - 汤莱恩
편집된 질문7일 11월 2017 в 10:07
프로그래밍
html css html-table background-image
16일 4월 2011 в 2:39
468 파운드
해결책
<table cellspacing="0" cellpadding="0">

또한 css.

table {border: none;}
  • EDIT:* 공식적으로 언급된 대로, 이 솔루션은 이젤 사용되지 않는 (아직 작동됨 표시되어도), 네가 만일 처음부터 함께 # 39 의 국경 축소 솔루션이므로 jnpcl& 검색하기를 합니다.

사실 그동안 상당히 싫어하는 이 변경 (don& # 39 표, t 작동합니까 종종 나타나는). 그 과정에서 일부 작업을 좀 더 복잡하다. E. g. 포함할 때 서로 다른 두 테두리 같은 장소 (시각), 다른 하나는 맨 위에 있는 동안, 두 번째 행 한 행이 있다. 그들은 축소 (= 그 중 하나만 표시됩니다). 그럼 어떻게 부여됩니까 border& # 39 의 &quot priority&quot 검토인 합니다;; 그리고 어떤 국경 스타일은 계산됩니까 &quot stronger"; (이중 vs. 솔리드로 등).

I did 다음과 같습니다.

<table cellspacing="0" cellpadding="0">
  <tr>
    <td class="first">first row</td>
  </tr>
  <tr>
    <td class="second">second row</td>
  </tr>
</table>

----------

.first {border-bottom:1px solid #EEE;}
.second {border-top:1px solid #CCC;}

이제 이 won& # 39 로 축소, 국경, t 작동합니까 있기 때문에 항상 1 국경 재거됨. 내가 해야 할 다른 방법으로 (더 많음을 솔루션뀉뀉뀉뀉 ofc). Css3 기입란 섀도 함께 사용하여 하나의 할 가능성도 배제할 수 없다.

<table class="tab">
  <tr>
    <td class="first">first row</td>
  </tr>
  <tr>
    <td class="second">second row</td>
  </tr>
</table>​​​


.tab {border-collapse:collapse;}
.tab .first {border-bottom:1px solid #EEE;}
.tab .second {border-top:1px solid #CCC;box-shadow: inset 0 1px 0 #CCC;}​

그루브 능선, 인세트의 outset&quot &quot 같은 항목을 사용할 수도 있습니다. 한 번의 테두리 스타일을 정의하였다. 나를 위한 것이 아니다, 내가 최적이고 can& # 39, 색계열 동시에 제어할 수 없다.

어쩌면 좋아 # 39 는 몇 가지 단순한 솔루션 및 축소, 하지만 난 아직 내가 테두리, t, t # 39 장난하는거아니고 haven& haven& 볼 수 있어 많은 시간을 보냈다. 여기에서 어쩌면 누군가 우리를 / 나를 볼 수 있습니다.)

Damb
편집된 답변25일 11월 2012 в 9:31
해설 (2)
 
table {
    border-collapse: collapse;
}
Aruna Herath
편집된 답변6일 10월 2018 в 3:46
해설 (0)

내가 나를 위해 이 같은 일이 완전히 제거할 필요가 있다 테이블에서 모든 셀입니다. 이 경우, 이는 HTML 전혀 수정하지 않아도 도움됐네 내 경우.

table, tr, td {
    border: none;
}
해설 (1)

하지만 최고 대답 없는 환경에 적용할 수 있는 부트스트랩에 모두 제거한 다음 국경을 맞대고 있다.

.noBorder {
    border:none !important;
}

적용할 수 있다.

<td class="noBorder">
Gökhan Kurt
편집된 답변12일 11월 2016 в 10:30
해설 (1)

환경 슬라이드에서는 받을시간은 부트스트랩에 내 해결책:

    <table style="border-collapse: collapse; border: none;">
        <tr style="border: none;">
            <td style="border: none;">
            </td>
        </tr>
    </table>
해설 (0)

이게 문제가 해결되었습니다 가져다줄래요:

Html 태그를 추가할 수 있는 tr 이:

style="border-collapse: collapse; border: none;"

모든 것을 테이블 위에 있던 행일 제거되었으면 테두리가 있다.

Igor
편집된 답변8일 2월 2017 в 9:27
해설 (1)