如何设置行间距和字间距？

设置行间距和字之间的距离需要用到css样式。用line-height设置行间距；用letter-spacing设置字间距。具体如下：

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>设置行间距</title>
<style>.p1{line-height: 30px;}.p2{line-height: 12px;}
</style>
</head>
<body><p class="p1">斯蒂芬·库里（Stephen Curry），1988年3月14日出生于美国俄亥俄州阿克伦（Akron,Ohio），美国职业篮球运动员，司职控球后卫，效力于NBA金州勇士队。</p><p class="p2">斯蒂芬·库里于2009年通过选秀进入NBA后一直效力于勇士队，新秀赛季入选最佳新秀第一阵容；2014-15、2016-17、2017-18赛季三次随勇士队获得NBA总冠军；两次当选常规赛MVP，两次入选最佳阵容第一阵容，5次入选全明星赛西部首发阵容。</p>
</body>
</html>

效果如下：
注意：如果行间距设置的比文字大小还要小，会发生重叠。

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>设置字间距</title>
<style>.p1{letter-spacing: 5px;}.p2{letter-spacing: 1em;}
</style>
</head>
<body><p class="p1">斯蒂芬·库里（Stephen Curry），1988年3月14日出生于美国俄亥俄州阿克伦（Akron,Ohio），美国职业篮球运动员，司职控球后卫，效力于NBA金州勇士队。</p><p class="p2">斯蒂芬·库里于2009年通过选秀进入NBA后一直效力于勇士队，新秀赛季入选最佳新秀第一阵容；2014-15、2016-17、2017-18赛季三次随勇士队获得NBA总冠军；两次当选常规赛MVP，两次入选最佳阵容第一阵容，5次入选全明星赛西部首发阵容。</p>
</body>
</html>

效果如下：
注意：1.em是相对长度单位。相对于当前对象内文本的字体尺寸。
2.允许使用负值。如果使用负值，那么字会重叠。一般使用负数来实现文字重叠的效果。

如何设置行间距和字间距？相关推荐

iOS UILabel设置行间距和字间距并计算高度
转载自: http://blog.csdn.net/luco2008/article/details/50977718 #define UILABEL_LINE_SPACE 6 #define HE ...
iOS开发技巧之：UILabel设置行间距和字间距并计算高度
#define UILABEL_LINE_SPACE 6 #define HEIGHT [ [ UIScreen mainScreen ] bounds ].size.height //给UILabe ...
iOS UILabel 设置行间距和字间距并计算高度
#define UILABEL_LINE_SPACE 6 #define HEIGHT [ [ UIScreen mainScreen ] bounds ].size.height //给UILabe ...
textview点击展开全部或收起，内容过长显示省略号，设置行间距，字间距，跑马灯显示
跑马灯显示 android:ellipsize="marquee" android:singleLine="true" paomad.setSelected(t ...
Java富文本设置行间距,设置行间距、字间距和计算富文本高度
上篇文章<富文本用法总结>详细码了关于富文本的一些用法,有介绍行间距的设置方法.在实际开发中经常需要根据后台返回的文字计算控件宽度和高度进行布局,这篇就配合上一篇来设置字间距和计算高度. ...
CSS设置行间距和字间距
CSS设置行间距在CSS中通过line-height属性来实现行间距的设置,line-height的值表示的是两行文字之间基线的距离. 文字的基线,指的是如果给文字加上下划线,那么上下划线就是文字的 ...
iOS设置富文本行间距、字间距
Demo下载地址我们在展示文字信息时,经常会碰到换行自适应高度的文本,这时我们会发现换行之后,文本之间的行间距依然很小,导致看起来很拥挤,影响美观.因此以下代码就是来解决这些问题,新建一个NSStr ...
ios label文字行间距_iOS设置UILabel文字的行间距和字间距
释放双眼,带上耳机,听听看~! 可以在UILabel的Category中提供如下几个方法: .h文件 @interface UILabel (ChangeLineSpaceAndWordSpace) ...
Android多屏幕适配之字体大小、行间距和字间距
code小生,一个专注Android领域的技术平台作者:星际旅行android 地址:https://www.jianshu.com/p/730d0b2c1c5d 声明:本文已获星际旅行androi ...

如何设置行间距和字间距？

如何设置行间距和字间距？相关推荐

最新文章

热门文章