This is three spaces<"/> This is three spaces<">

Home  >  Article  >  Web Front-end  >  How to express spaces in uniapp (two ways)

How to express spaces in uniapp (two ways)

PHPz
PHPzOriginal
2023-04-14 11:38:226186browse

There are two ways to represent spaces in Uniapp, you can use HTML entity representation or text spacing attributes in CSS style sheets.

  1. Use HTML entity representation:

In HTML, the entity representation of spaces is " ". In Uniapp's template syntax, this entity can also be used directly to represent spaces.

For example, to add three spaces to a text block, you can write:

<template>
  <view>这   是三个空格</view>
</template>
  1. Use the text spacing property in the CSS style sheet:

In the CSS style sheet, you can use the words-spacing attribute to set the spacing between text. The value of this attribute is the width of the space, which can be set to a specific pixel value or units such as em.

For example:

<template>
  <view class="text">这是一段文字,<span>这里有个空格</span>,还有一个空格<span> </span>和一个em空格<span>&emsp;</span></view>
</template>

<style>
  .text span {
    font-size: 20px;
    word-spacing: 10px; /* 文字之间增加10px的间距 */
  }
  .text span:last-child {
    word-spacing: 1em; /* 文字之间增加一个em的间距 */
  }
</style>

By using the above two methods, you can easily express spaces in Uniapp projects.

The above is the detailed content of How to express spaces in uniapp (two ways). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn