0

テーブルビューにリストするアイテムのリスト、つまり4 * 4、4行、4列があります。デスクトップ ビュー (1024+) の各要素の幅 (約 158px) と高さ (約 200px) は固定されています。このサイトはレスポンシブである必要があるため、html を変更せずにタブレット ビュー (768 以下) の各行に 1 つの td を表示し、メディア クエリを追加して 100% で td を作成することにしました。これが構文的に有効であり、ブラウザでコンパクト化できることを確認したいと思います。

これがhtml構造です

<tr>
    <td><div>........</div></td>
    <td><div>........</div></td>
    <td><div>........</div></td>
    <td><div>........</div></td>
</tr>
in desktop view each td will have a width of about 158px

<tr>
    <td><div>........</div></td>
    <td><div>........</div></td>
    <td><div>........</div></td>
    <td><div>........</div></td>
</tr>
in Tablet view view each td will have a width of 98% and 1% padding
4

0 に答える 0