HTML DOM Style letterSpacing 属性

htmlweb developmentfront end technology更新于 2024/3/15 3:56:17

HTML DOM Style letterSpacing 属性用于设置或获取文本之间的字符间距。

以下是语法 −

设置 letterSpacing 属性 −

object.style.letterSpacing = "normal|length|initial|inherit"

以上属性解释如下 −

值	描述
normal	这是默认属性，将字符间距设置为正常。
length	用于以长度单位指定字符间距，也允许使用负值。
initial	用于将此属性设置为初始值。
inherit	继承父级属性值

让我们来看一个 letterSpacing 属性的示例:

示例

<!DOCTYPE html>
<html>
<head>
<script>
   function changeSpacing() {
      document.getElementById("myP").style.letterSpacing = "12px";
      document.getElementById("Sample").innerHTML = "The space between characters is now increased";
   }
</script>
</head>
<body>
   <p id="myP">This is some text inside the sample paragraph. This is another line in paragraph. This    is second line in paragraph. This is third line in paragraph. </p>
   <p>Increase the space between characters in the above paragraph by clicking the below button</p>
   <button type="button" onclick="changeSpacing()">Increase Letter Spacing</button>
   <p id="Sample"></p>
</body>
</html>