データベースをテーブルに表示してテキストを直接表示する方法

Question

データベースをテーブルに表示したいが、表示したいテキストが長すぎる場合、テキストは直接ダウンしない。 「質問」のテキストは直接入力されません。

Answer 1

があなたのスタイルでword-wrap: break-word;を使用してみてください：

<table class="table"> 
         <thead> 
         <tr> 
         <th>No</th> 
         <th>Question</th> 
         <th>A</th> 
         <th>B</th> 
         <th>C</th> 
         <th>D</th> 
         <th>Answer</th> 
         <th>Button</th> 
         </tr> 
         </thead> 
         <tbody> 
         <?php 
         include "conection.php"; 
         $no = 1; 
         $query = mysql_query("SELECT * FROM grammar"); 
         if ($query) { 
         while ($row = mysql_fetch_array($query)) { 
          echo " 
           <tr> 
            <td>".$no."</td> 
            <td>".$row['question']."</td> 
            <td>".$row['a']."</td> 
            <td>".$row['b']."</td> 
            <td>".$row['c']."</td> 
            <td>".$row['d']."</td> 
            <td>".$row['answer']."</td> 
            <td> 
             <a href=\"update.php?id=\">Edit</a> | 
             <a href=\"delete_grammar.php?id=\">delete</a> 
            </td> 
           </tr>"; 
          $no++; 
          } 
         } 
         ?> 
         </tbody> 
        </table> 

これは絵がある：これは私のコードです

助けてください。最大文字数に達すると文字列が下がります。

<table class="table"> 
         <thead> 
         <tr> 
         <th>No</th> 
         <th>Question</th> 
         <th>A</th> 
         <th>B</th> 
         <th>C</th> 
         <th>D</th> 
         <th>Answer</th> 
         <th>Button</th> 
         </tr> 
         </thead> 
         <tbody> 
         <?php 
         include "conection.php"; 
         $no = 1; 
         $query = mysql_query("SELECT * FROM grammar"); 
         if ($query) { 
         while ($row = mysql_fetch_array($query)) { 
          echo " 
           <tr> 
            <td>".$no."</td> 
            <td style='width:40%; word-wrap: break-word;'>".$row['question']."</td> 
            <td>".$row['a']."</td> 
            <td>".$row['b']."</td> 
            <td>".$row['c']."</td> 
            <td>".$row['d']."</td> 
            <td>".$row['answer']."</td> 
            <td> 
             <a href=\"update.php?id=\">Edit</a> | 
             <a href=\"delete_grammar.php?id=\">delete</a> 
            </td> 
           </tr>"; 
          $no++; 
          } 
         } 
         ?> 
         </tbody> 
        </table> 

はここでサンプルJSFiddle

Answer 2

リーからの答えはあなたが必要な結果を得るだろうが、彼らは読みやすさを減らすことができるセット幅に達した場合はすべての単語の長さがそのように破ることができることに注意してくださいです。あなたが撮ったスクリーンショットは、その列を質問フィールドとして置きます。その質問は潜在的に非現実的な内容のテストのように見えますが、奇妙なことを説明するのは良いことです。電子メールアドレスまたはURL列にこのようなオーバーフローの問題が発生する可能性があり、可読性がユーザーの必要性にあまり影響しない可能性があります。ほとんどのユーザーはおそらく質問を素早く読むことができたいと思っています。

可読性が依然として必要な場合は、overflow-x：autoまたはhidden、width 100％のdiv内にそのセルの内容をラップできます。

これは、このような可能性のあるまれなインスタンスを切り捨てるか、少なくともユーザーがテキストをスクロールできるようにします。

コンテナtdは、すべてのブラウザでテーブルが正しく処理されるためには、ピクセル単位で、または変数ではない他の単位で、特定の幅が必要です。必要に応じて、100％幅ではなくdivにピクセル幅を追加することもできます。