当有时候需要在页面显示时显示空格时,可以使用 ,但是使用这个占位符时,无论写多少个,就只能显示一个空格。要想显示多个空格进行占位,这种方式显然是可行的,解决方法是使用转义字符。

先看代码:

<template>
<div>
<el-row style="background-color: rgb(118, 118, 233);">
<el-col :span="10">&nbsp;</el-col>
<el-col :span="5">你好</el-col>
</el-row>
<el-row style="background-color: rgb(0, 195, 255);">
<el-col :span="10" v-html="'\u00a0'"/>
<el-col :span="5">你好</el-col>
</el-row>
</div>
</template>

效果图:

根据图可以发现,当使用&nbsp;占位时并不会显示出来,用v-html和转义字符结合便可达到效果。

其中'\u00a0'是'nbsp'的16进制表示,也可以使用下表的值:

'nbsp' '\u00a0'
'ensp' '\u2002'
'emsp' '\u2003'

Vue使用&nbsp空白占位符的更多相关文章

  1. [占位符 &nbsp; ]

    在做项目的时候,数据库中的数据会存在空值;这样,我们需要在前台给它加以判断, 如果我们不加以判断也是可行的,我们需要添加一个空白占位符  空白占位符 是个不错的选择,这样我们的页面显示数据的时候就不会 ...

  2. wpf 空白汉字占位符

    <TextBlock xml:space="preserve" Text="主  编" />   表示一个汉字占位符

  3. 【GoLang】GoLang fmt 占位符详解

    golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. # 定义示例类型和变量 type Human struct { Name string } var peo ...

  4. es6 模板字变量和字符串占位符

    开发者一直在寻找一种创建多行字符串的形式,但要使用单引号双引号字符串一定要在同一行才行. 老办法: 还有其他办法,虽然能实现,但是太啰嗦 es6模板自变量 使用反撇好(`)替换了单双引号 反撇好中的所 ...

  5. golang fmt格式“占位符”

    # 定义示例类型和变量 type Human struct { Name string } var people = Human{Name:"zhangsan"} 普通占位符 占位 ...

  6. golang fmt占位符

    golang fmt格式"占位符" golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. 定义示例类型和变量 type Human stru ...

  7. 占位符golang

    定义示例类型和变量 type Human struct { Name string } var people = Human{Name:"zhangsan"} 普通占位符 占位符 ...

  8. golang fmt格式占位符

    golang 的fmt 包实现了格式化I/O函数,类似于C的 printf 和 scanf. # 定义示例类型和变量 type Human struct { Name string } var peo ...

  9. Python全栈工程师(while、占位符)

    ParisGabriel     Python 入门基础         UnicodeASCII 用8个位表示文字 ,最高位一定是零,低七位表示数值Unicode是由16个位组成的(65535) 最 ...

随机推荐

  1. 从ReentrantLock实现非公平锁的源码理解AQS中的CLH队列

    虽然前面也看过AQS的文章,并且转载过一篇大佬的分析,但是我觉得他们对于AQS和ReentrantLock部分的源码的分析并不详细,自己理解期来还是有问题,于是自己准备花时间重新梳理下,好了,进入正题 ...

  2. Centos8上搭建EMQ MQTT

    layout: post title: Centos8上搭建EMQ MQTT subtitle: 在阿里云Centos8搭建EMQ并配置接入 date: 2020-3-11 author: Dapen ...

  3. Flink-v1.12官方网站翻译-P005-Learn Flink: Hands-on Training

    学习Flink:实践培训 本次培训的目标和范围 本培训介绍了Apache Flink,包括足够的内容让你开始编写可扩展的流式ETL,分析和事件驱动的应用程序,同时省略了很多(最终重要的)细节.本书的重 ...

  4. Yarn参数优化(Fair Scheduler版本)

    YARN 自从hadoop2.0之后, 我们可以使用apache yarn 来对集群资源进行管理.yarn把可以把资源(内存,CPU)以Container的方式进行划分隔离.YARN会管理集群中所有机 ...

  5. 2018-2019 ACM-ICPC, NEERC, Southern Subregional Contest, Qualification Stage(11/12)

    2018-2019 ACM-ICPC, NEERC, Southern Subregional Contest, Qualification Stage A. Coffee Break 排序之后优先队 ...

  6. hdu 6867 Tree 2020 Multi-University Training Contest 9 dfs+思维

    题意: 给你一个由n个点,n-1条有向边构成的一颗树,1为根节点 下面会输入n-1个数,第i个数表示第i+1点的父节点.你可以去添加一条边(你添加的边也是有向边),然后找出来(x,y)这样的成对节点. ...

  7. 2019牛客暑期多校训练营(第三场)B题、H题

    传送门 题意: 就是说给你一个由0或1组成的字符串,让你找出来一个0的数量和1的数量相等的最长子字符串和最长子序列 题解: 可以把0当作-1,把1当作1来计算字符串的前缀和 这样的话,当两个位置的前缀 ...

  8. Python_微信支付(云开发)

    一.创建云开发小程序 1.初始化云开发环境 //app.js App({ onLaunch: function () { wx.cloud.init({ //初始化云开发环境 env: 'wxypay ...

  9. 牛客多校第九场H Cutting Bamboos(主席树 区间比k小的个数)题解

    题意: 标记为\(1-n\)的竹子,\(q\)个询问,每次给出\(l,r,x,y\).要求为砍区间\(l,r\)的柱子,要求砍\(y\)次把所有竹子砍完,每次砍的时候选一个高度,把比他高的都砍下来,并 ...

  10. Ajax 实战大全!

    1.html 文件 ( form.html) 1 <!DOCTYPE HTML> 2 <html> 3 <head> 4 <meta http-equiv=& ...