小程序text组件内部上边距的问题
index.wxml:
<view class="slogan">
<text>
建立跨文化的全球视野,做世界公民
</text>
</view>
index.wxss:
.slogan{
padding:19rpx 0;
background-color: #39B371;
text-align: center;
color:#FFFFFF;
}
.slogan>text{
font-size:20rpx;
line-height: 20rpx;
}
效果:

明显看到上边距多了,我们将text设置为block块:
.slogan>text{
font-size:20rpx;
line-height: 20rpx;
display: block;
}

检查下来发现text有个内边距。
这个问题,解决也很简单,就是text内容不要写成几行,一行就可以了:
<view class="slogan">
<text>建立跨文化的全球视野,做世界公民</text>
</view>
对,就是这么简单。
题外话,text更像h5里面的span而不是p,并不是一个块级元素。
小程序text组件内部上边距的问题的更多相关文章
- 微信小程序_(组件)icon、text、rich-text、progress四大基础组件
微信小程序基础组件官方文档 传送门 Learn 一.icon图标组件 二.rich-text富文本组件 三.text文本组件 四.progress进度条组件 一.icon图标组件 type:icon的 ...
- 微信小程序自定义组件的使用以及调用自定义组件中的方法
在写小程序的时候,有时候页面的内容过多,逻辑比较复杂,如果全部都写在一个页面的话,会比较繁杂,代码可读性比较差,也不易于后期代码维护,这时候可以把里面某部分功能抽出来,单独封装为一个组件,也就是通常说 ...
- 微信小程序弹窗组件
概述 自己封装的一个比较简单微信弹窗小组件,主要就是教会大家对微信小组件的用法和理解,因为微信小程序对组件介绍特别少,所以我就把自己的理解分享给大家 详细 代码下载:http://www.demoda ...
- 小程序web-view组件
不久前微信小程序发布了web-view组件,这个消息在各个圈里引起不小的涟漪.近期正好在做小程序的项目,便研究了一下这个让大家充满期待的组件. 1,web-view这个组件是什么鬼? 官网的介绍: ...
- 小程序input组件获得焦点时placeholder内容有重影
这个问题是小程序input组件的bug,目前的解决办法可以,在input标签上加一个其他标签,显示placeholder内容,获得焦点时消失,失去焦点时候再让其显示 <view class='i ...
- 微信小程序倒计时组件开发
今天给大家带来微信小程序倒计时组件具体开发步骤: 先来看下最终效果: git源:http://git.oschina.net/dotton/CountDown 分步骤-性子急的朋友,可以直接看最后那段 ...
- [转]小程序web-view组件
本文转自:https://www.cnblogs.com/-nothing-/p/7910355.html 1,web-view这个组件是什么鬼? 官网的介绍:web-view 组件是一个可以用来承载 ...
- 微信小程序的组件总结
本文介绍微信小程序的组件 视图容器 基础内容 表单组件 导航组件 媒体组件 视图容器 view 布局容器 <view hover-class='bg'>222</view> 可 ...
- 微信小程序_(组件)scroll-view可滚动视图
微信小程序scroll-view组件官方文档 传送门 提前准备:使用<view>组件制作五条撑满的横向区域 <!--index.wxml--> Cynical丶Gary < ...
随机推荐
- PL/SQL Challenge 每日一题:2014-3-14 11gR2中带RELIES_ON子句的RESULT_CACHE函数
PL/SQL Challenge 每日一题:2014-3-14 11gR2中带RELIES_ON子句的RESULT_CACHE函数 最先答对且答案未经编辑的puber将获得纪念章一枚(答案不可编辑但可 ...
- [JZOJ4687]奇袭
[JZOJ4687]奇袭 题目 由于各种原因,桐人现在被困在Under World(以下简称UW)中,而UW马上要迎来最终的压力测试——魔界入侵. 唯一一个神一般存在的Administrator被消灭 ...
- sgu 194 无源汇有上下界的最大流(最大流模板dinic加优化)
模板类型的题具体参考国家集训队论文:http://wenku.baidu.com/view/0f3b691c59eef8c75fbfb35c.html 参考博客:http://blog.csdn.ne ...
- CODEVS——T 1049 棋盘染色
http://codevs.cn/problem/1049/ 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 查看运行结果 题目描述 Descr ...
- AngularJS:一行JS代码实现控件验证效果
如上图所示,我们需要实现如下这些验证功能: 控件都是必输控件 都需要控制最大长度 第一次打开页面,控件不能显示为错误状态 输入内容再清空后,必输控件需要显示为错误状态 只有所有输入合法后,发布按钮才能 ...
- [ javascript ] getElementsByClassName与className和getAttribute!
对于javascript中的getElementsByClassName 在IE 6/7/8 不支持问题. 那么须要模拟出getElementsByClassName 须要採用className属性 ...
- HDU 3666
此题不难,不等式很空易就列出来了,只是要把它转化成减法形式..卡在这了... 其实取一个log对数就好了...要记住这个技巧.用基于dfs的spfa.. #include<iostream> ...
- java Regex
超全 http://www.rexegg.com/regex-lookarounds.html 这篇文章不错:http://www.cnblogs.com/lzq198754/p/5780340.ht ...
- Windows 驱动开发 - 8
最后的一点开发工作:跟踪驱动. 一.驱动跟踪 1. 包括TMH头文件 #include "step5.tmh" 2. 初始化跟踪 在DriverEntry中初始化. WPP_INI ...
- Java 接口(interface)的三种类型
放入接口中的任何域(成员变量)都自动是 static 和 final 的: 1. 包含抽象方法的常规接口 2. 全部是常量的 接口类中的方法和属性不要添加任何修饰符号(public 也不需要). 因为 ...