>source

여기는 jsfiddlecode와 함께. CSS에 문제가 있다는 것을 알고 있지만 CSS에 능숙하지 않아 내가 뭘 잘못하고 있는지 알 수 없습니다. 올바르지 않은 유일한 것은 내부 테이블의 내용이 테이블 중앙에 있지 않다는 것입니다. 특히 상단의 링크 텍스트와 그 아래의 관련 이미지입니다.

외부 테이블을 제거하면 중앙에 있어야 합니다. 나는 -moz-force-broken-image-icon을 포함했습니다: 1; 속성이므로 이미지가 없기 때문에 이미지의 크기가 있을 것입니다. 다른 브라우저에서 그렇게 하기 위해 추가해야 할 동등한 속성을 모르겠습니다.

CSS:

body {
    margin:0;
    background-image:url('Images/big1.jpg');
    background-repeat:no-repeat;
    background-attachment:fixed;
    background-color:black;
    color:aliceblue;
    font-family:Tahoma, sans-serif;
    font-size:12pt;
  }
  a {
    color:mediumspringgreen;
  }
  table {
    border:none;
    padding:0;
    border-spacing:0;
    border-collapse:colseplapse;
  }
  .table2 {
    border:1px solid silver;
    padding:0 0 0 0;
    border-spacing:0;
    margin-right:auto;
    margin-left:auto;
  }
  .table3 {
    border:1px solid silver;
    padding:2px 4px 2px 4px;
    border-spacing:0;
  }
  .thead {
    display: table;
    table-layout:fixed;
    width: auto;
  }
  .tbody {
    display: block;
    height: 34em;
    overflow-y: scroll;
  }
  .tbody tr {
    display: table;
    table-layout:fixed;
    width: auto;
  }
  .td1 {
    text-align:left;
    font-family:Tahoma, sans-serif;
    font-size:1em;
    font-weight:bold;
    color:springgreen;
  }
  .img {
    -moz-force-broken-image-icon: 1;
    width:162px;
    height:116px;
  }
  .bottom {vertical-align:bottom;}
  .center {text-align:center;}
  .bold {font-weight:bold;}
  .bolder {font-weight:900;}

HTML:

<TABLE class='table2'>  <THEAD class='thead'>  </THEAD>  <TBODY class='tbody'>    <TR>      <TH class='td1 table3'>        <TABLE>          <TR>          <TH colspan=5><A href='R1_Jula.html' target='new'>Region 1:<BR>Jula<BR><BR><IMG class='img bottom' src='GreatCrystal/Jula_Thumb.PNG' alt='Region 1: Jula'></A></TH>          </TR><TR>            <TD class='center bold'><A href='GreatCrystal/Jula_Front.PNG' target='new' title='Region 1, Jula: Front View'>Front View</A></TD>            <TH class='bolder'>|</TH>            <TD class='center bold'><A href='GreatCrystal/Jula_Side.PNG' target='new' title='Region 1, Jula: Side View'>Side View</A></TD>            <TH class='bolder'>|</TH>            <TD class='center bold'><A href='GreatCrystal/Jula_Top.PNG' target='new' title='Region 1, Jula: Top View'>Top View</A></TD>          </TR>        </TABLE>      </TH>    </TR>  </TBODY></TABLE>

  • 답변 # 1

    잘못된 부분을 파악하고 수정했습니다. 그만큼 jsfiddle지금 작동하는지 확인합니다. code는 다음과 같이 수정됩니다.

    CSS

    body {
        margin:0;
        background-image:url('../Images/big1.jpg');
        background-repeat:no-repeat;
        background-attachment:fixed;
        background-color:black;
        color:aliceblue;
        font-family:Tahoma, sans-serif;
        font-size:12pt;
      }
      a {
        color:mediumspringgreen;
      }
      table {
        border:none;
        padding:0;
        border-spacing:0;
        border-collapse:collapse;
      }
      .table2 {
        border:1px solid silver;
        padding:0 0 0 0;
        border-spacing:0;
        margin-right:auto;
        margin-left:auto;
      }
      .table3 {
        border:1px solid silver;
        padding:2px 4px 2px 4px;
        border-spacing:0;
      }
      .thead {
        display: table;
        table-layout:fixed;
        width: auto;
      }
      .tbody {
        display: block;
        table-layout:fixed;
        position:relative;
        margin: auto;
        height: 34em;
        overflow-y: scroll;
      }
      .td1 {
        text-align:left;
        font-family:Tahoma, sans-serif;
        font-size:1em;
        font-weight:bold;
        color:springgreen;
      }
      .center {text-align:center;}
      .bold {font-weight:bold;}
      .bolder {font-weight:900;}
      .img {
        display: block;
        table-layout:fixed;
        position:relative;
        margin-left:18%;
        margin-right:18%;
        -moz-force-broken-image-icon: 1;
        width:162px;
        height:116px;
      }
    

    HTML

      <TABLE class='table2'>      <THEAD class='thead'>      </THEAD>      <TBODY class='tbody'>      <TR>        <TD class='td1 table3' style='border-top:none;border-bottom:none;border-left:none'>          <TABLE>            <TR>              <TH colspan=5 class='center'><A href='R1_Jula.html' target='new'>Region 1:<BR>Jula<BR><BR><IMG class='img border0 bottom' src='GreatCrystal/JulaThumb.png' alt='Region 1: Jula'></A></TH>            </TR><TR>              <TD class='center bold'><A href='GreatCrystal/JulaFront.png' target='new' title='Region 1, Jula: Front View'>Front View</A></TD>              <TH class='bolder'>|</TH>              <TD class='center bold'><A href='GreatCrystal/JulaSide.png' target='new' title='Region 1, Jula: Side View'>Side View</A></TD>              <TH class='bolder'>|</TH>              <TD class='center bold'><A href='GreatCrystal/JulaTop.png' target='new' title='Region 1, Jula: Top View'>Top View</A></TD>            </TR>          </TABLE>        </TD>      </TR>      </TBODY>    </TABLE>

  • 이전 postgresql : AWS의 Oracle FDW 지원
  • 다음 암호화 현물 가격을 얻기 위한 Coinbase API 호출