letter-spacing

# letter-spacing

CSS 的 letter-spacing 属性用于设置文本字符的间距表现。在渲染文本时添加到字符之间的自然间距中。letter-spacing 的正值会导致字符分布得更远，而 letter-spacing 的负值会使字符更接近。

# uni-app x 兼容性

Web	Android	iOS	HarmonyOS
4.0	3.9	4.11	4.61

# 语法

letter-spacing: normal | <length>;

示例源码如下，请查看 pre > code 标签中的内容

letter-spacing: normal | <length>;

# 值限制

length
length-function

# letter-spacing 的属性值

名称

兼容性

描述

normal

此间距是按照当前字体的正常间距确定的。和 0 不同的是，normal 会让用户代理调整文字之间空间来对齐文字。

# 默认值

平台	默认值
uvue	0

注意：W3C 默认值为：normal

# 适用组件

text
button

# 示例

示例为hello uni-app x alpha分支，与最新HBuilderX Alpha版同步。与最新正式版同步的master分支示例另见

示例

<template>
	<view style="flex-grow: 1;">
		<view style="height: 250px;background-color: gray;justify-content: center;align-items: center;">
			<text class="common">letter-spacing</text>
			<text class="common" style="letter-spacing: 5px;">letter-spacing: 5px</text>
			<text class="common" style="letter-spacing: -2px;">letter-spacing: -2px</text>
		</view>
	</view>
</template>

<script>

</script>

<style>
	.common {
		font-size: 20px;
	}
</style>

示例源码如下，请查看 pre > code 标签中的内容

<template>
	<view style="flex-grow: 1;">
		<view style="height: 250px;background-color: gray;justify-content: center;align-items: center;">
			<text class="common">letter-spacing</text>
			<text class="common" style="letter-spacing: 5px;">letter-spacing: 5px</text>
			<text class="common" style="letter-spacing: -2px;">letter-spacing: -2px</text>
		</view>
	</view>
</template>

<script>

</script>

<style>
	.common {
		font-size: 20px;
	}
</style>