2016-10-17 11 views
0
<!DOCTYPE html> 

<html lang="en" xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <title></title> 
    <link href="animatedwebsite.css" rel="stylesheet" type="text/css" /> 

    <style> 
     table, tr, td, th { 
      border:1px solid black; 

     } 

     table { 
      width:100%; 
      height:100%; 


     } 
     #logo { 
      height:50px; 
      width:50px; 
      top:20px; 
      left:10px; 
      border:1px solid black; 

     } 
     html { 
      height:100%; 
      width:100%; 
     } 
     body { 
      height:100%; 
      background-color:deepskyblue; 
      width:100%; 

     }  
    </style> 
</head> 
<body> 
    <!-- <img id="logo" src="http://mememarketmedia.s3.amazonaws.com/dank/tumblr_oamv1kgXlN1uy57v5o1_1280.jpg"/> --> 
    <table> 
     <tr height="12%" id="1"> 
      <th width="15%" id="logoarea"></th> 
      <th width="85%" colspan="2" id="slogan"></th> 
     </tr> 
     <tr height="8%" id="2"> 
      <td width="100%" colspan="3" id="navbararea"></td> 
     </tr> 
     <tr height="40%" id="3"> 
      <td width="100%" colspan="3" id="imgarea"></td> 
     </tr> 
     <tr id="4"> 
      <td width="33%" id="whyus"></td> 
      <td width="34%" id="startnow"></td> 
      <td width="33%" id="chatonline"></td> 
     </tr> 
     <tr id="5" height="5%"> 
      <td colspan="3" id="menu123"></td> 
     </tr> 
     <tr id="6" height="5%"> 
      <td colspan="3" id="footerarea"></td> 
     </tr> 
    </table> 


</body> 
</html> 

私の問題は、最初の最初の行セルと4番目の行セルの幅の値が変更されたときはいつでも、最初の行のセルの幅を定義するとすぐに4番目の行のセルwidthsは最初の行のコピーを開始します。私はこれが前に起こったことがないので、なぜこれが起こったのか分からないし、私はこれがおそらく何か愚かなことを知っている。テーブルセル幅%値は他のセル幅の値を単独で変更しますか?

+0

これはテーブルを使用することです。列はすべて同じ*とみなされます。幅を変えたい場合は、テーブル以外のものを使用するか、複数のテーブルを使用する必要があります。 Microsoft Excelのテーブルに複数の列幅を設定することはできません。 – RobertAKARobin

答えて

0

そこに矛盾がある:

これは、一番上の行である:

<tr height="12%" id="1"> 
    <th width="15%" id="logoarea"></th> 
    <th width="85%" colspan="2" id="slogan"></th> 
</tr> 

注:最初のセル/ thwidth="15%"

を有し、これは第4行である。

<tr id="4"> 
    <td width="33%" id="whyus"></td> 
    <td width="34%" id="startnow"></td> 
    <td width="33%" id="chatonline"></td> 
</tr> 

ここで最初のセル/それはそれらのいずれかを変更すると、いくつかの方法で、他に影響を与えていることも不思議ではありません - -は、ブラウザがこれの作るものは何でもwidth="33%"

を持っている同じ列のセルは、常に(colspan設定がある場合を除いて)同じ幅を持つことになります

+0

助けてくれてありがとう! – Durubie

0

これは、表のセルの予想される動作です。彼らは列の下まで一直線に並んでいます。

テーブルを使ってデザインしているようですが、これはウェブページをデザインする方法ではありません。表は表形式のデータ用です。適切なセマンティックマークアップ(div、セクション、記事、ヘッダー、フィギュアなど)を使用してページを構成し、CSSを使用してページをレイアウトし、スタイルを設定します。

関連する問題