简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
javascript - 如何精准匹配设计图纸尺寸
黄舟
黄舟 2017-04-11 11:55:06
0
1
344

设计稿要求上下字与字之间的高度是10px
但是如果简单的设置一个margin-bottom：10px；会发现实际的高度是大于10px的。
有什么好的办法来实现字与字之间的高度精准问题么？
（ps.目前用工具量出来实际高度再去从设置的margin-bottom：10px中减去。但是这样非常麻烦。）

css部分 *{ margin: 0; padding: 0; } .wrap p{ font-size:22px; border:1px solid #000; margin-bottom:10px; } html部分 
 
商品名
 
100元
黄舟
黄舟

人生最曼妙的风景，竟是内心的淡定与从容！

Antworte allen (1)
PHPzhong
PHPzhong2017-04-11 11:57:06 1 Etage

比如你的字体大小是14号字体，那么行高就为24。
如果你的字体大小是16号字体，那么行高就为36。
所以就是设置行高为一个字体大小+10px。
根据你的结构所以就是应该设置为

.wrap {line-height:1} .wrap p {margin-bottom: 10px}
 
商品名
 
100元
Wie+0
Antwort hinzufügen
    Beliebte Themen
    Mehr>
    Populäre Artikel
    Beliebte Tutorials
    Mehr>
    Verwandte Tutorials
    Beliebte Empfehlungen
    Aktuelle Kurse
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！