Vraag Geen spookmarge onder het HTML5-canvaselement?


Wanneer we een HTML5-canvaselement maken, verschijnt een spookmarge onder het canvaselement, ook al stellen we de marge en opvulling in op 0.

Voorbeeld: http://jsfiddle.net/yvbmd/

We hebben verschillende dingen geprobeerd, maar kunnen de spookmarge niet wissen.

Hoe kunnen we het canvaselement maken zonder die spookmarge?


22
2018-03-26 19:01


oorsprong


antwoorden:


Toevoegen vertical-align: bottom ernaar toe.

Dit wordt veroorzaakt doordat het canvas een inline-element is. Als zodanig wordt het effectief als een personage beschouwd. Als zodanig moet het de basislijnregel volgen, dat wil zeggen om een ​​beetje ruimte onder de regel te laten in het geval van karakters zoals gjpqy die onder de basislijn dalen. Door de vertical-align naar bottom, u lijnt eigenlijk het canvas uit met de onderkant van de vervolgkeuzeletters. Zolang het doek zelf groter is dan het line-height, je zult geen problemen hebben. Moet het canvas korter zijn dan de line-height, je zult "spookmarges" zien boven het canvas waar het ruimte voor reserveert bdfhklt, de langere letters. Dit kan worden opgelost door een line-height: 1px regel.


41
2018-03-26 19:04