web-dev-qa-db-ja.com

定義と例を比較するのに最適なテーブルレイアウト（テキスト）

単語の正しい定義と正しくない定義を比較する表を例とともに示したいと思います。これに最適なテーブルレイアウトは何ですか？

例：正解：予想以上。また。例：私も多すぎました。不正解：数値2。例：人が多すぎます。

小さな画面でも読みやすいように、2つの列（Wordの列ではない）が適切だと思います。ただし、例を2列目に配置する場合は、別の行に配置するのが最善です。正しい定義と例はすべて1つの列のセルに収める必要がありますか、それとも1つの行に配置した方がよいですか？テーブルやテキストの色はどうですか？何が一番読みやすいですか？

何が一番いい？

layouttableshtmlcss
1
user1505631

私は物事を複雑にしないでしょう。多くの言語辞書は、人々が一般的に認識する規則を使用しています。

enter image description here

または代わりに

enter image description here

「Too」という単語を左側の列にするのではなく、上にある独自の行として中央揃えにしたい場合も、それでうまくいきます。しかし、ほとんどのモバイルデバイスは上記の例をうまく表示できるはずです（Twitter Bootstrapの3列）。

1
vphilipnyc

狭いデバイスについて非常に心配している場合は、各セットを3行に積み上げてください：Word、正しいdef、正しくないdef。そして、人々がそれを正しく行うことに関心がある場合（ESLはおそらく？）、人々が不変性を抽出できるように、いくつかの正しい使用法と正しくない使用法を提供する必要があります。

幅の広い画面の場合は、両方の列にまたがる行にWordを配置し、可能であればいくつかの例を提供して、可能であれば左右に対照させます。

色は好きなようにすることができますが、多くの人が不完全な色知覚を持っているので、正しいものを区別する唯一の方法として色を使用しないでください。

0
MMacD

並べて比較するのが最適です（2列）。 2つの列は、モバイルデバイスで読みやすいです。例を別の行に配置して、簡単に並べて、また斜体で簡単に読むことができるようにします。列に異なる色を付けますが、各定義の太字の導入部として「正しい：」、「誤った：」、および「例：」も使用します。

したがって、次のようになります。

**TOO**
**Correct**: More than expected; also. | **Incorrect**: The number 2.
---------------------------------------|--------------------------------
***Eg**: I, too, had too much.*        | ***Eg**: There were too people.*
0
ThatGuy