HTML5キャンバス要素の下のゴーストマージンを削除しますか？我々はHTML5のcanvas要素を作成すると

Question

は、ゴーストマージンは、私たちが0にマージンとパディングを設定していてもcanvas要素の下に表示されます

例：私たちは、「物事の様々なを試してみましたが、でき

http://jsfiddle.net/yvbmd/ゴーストマージンを消去してください。

このゴーストマージンを持たないキャンバス要素を作成するにはどうすればよいですか？

Answer 1

vertical-align: bottomを追加します。

これは、キャンバスがインライン要素であるために発生します。したがって、それは効果的に文字と見なされます。したがって、ベースラインの下にあるgjpqyなどの文字の場合は、ラインの下に少しのスペースを残すというベースラインのルールに従わなければなりません。 vertical-alignをbottomに設定すると、実際にキャンバスをドロップダウン文字の一番下に揃えています。キャンバス自体の高さがline-heightより大きい限り、問題はありません。キャンバスがline-heightよりも短い場合は、キャンバスの上に「ゴーストマージン」が表示されます。bdfhkltのスペースを確保しています。これは、line-height: 1pxルールを追加することで修正できます。