Demo : https://www.lenlop123.com/2020/09/13-letter-spacing-word-spacing-white.html
<style>
p.normal {
letter-spacing: normal;
}
p.positive {
letter-spacing: 4px;
}
p.negative {
letter-spacing: -1.5px;
}
</style>
<p class="normal">This paragraph has no additional letter-spacing applied.</p>
<p class="positive ">This paragraph is letter-spaced at 4px.</p>
<p class="negative">This paragraph is letter-spaced at -1.5px</p>

<style>
p.normal {
word-spacing: normal;
}
p.px {
word-spacing: 30px;
}
p.positive {
word-spacing: 20px;
}
p.negative {
word-spacing: -5px;
}
</style>
<p class="normal">This paragraph has no additional word-spacing applied.</p>
<p class="px">This paragraph is word-spaced at 30px.</p>
<p class="positive">This paragraph is word-spaced at 20px.</p>
<p class="negative">This paragraph is word-spaced at -5px.</p>

<style>
p {
white-space: nowrap;
}
p.pre {
white-space: pre;
}
p.preline {
white-space: pre-line;
}
p.prewrap {
white-space: pre-wrap;
}
</style>
<p>
This paragraph has multiple spaces and
a line break, but it will be ignored, as we used the nowrap value.
</p>
<p class="pre">
In the markup we have multiple spaces
and a line break.
</p>
<p class="preline">
In the markup we have multiple spaces
and a line break, but in the result multiple spaces are ignored.
</p>
<p class="prewrap">
In the markup we have multiple
spaces and a line break.
</p>

0 Nhận xét