小程序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 < ...
随机推荐
- Servlet的HttpServletResponse输出
了解其中的一些字符设置,PrintWriter输出等.. form.html: <!DOCTYPE html> <html> <head> <title> ...
- [bzoj4636]蒟蒻的数列_线段树
蒟蒻的数列 bzoj-4636 题目大意:给定一个序列,初始均为0.n次操作:每次讲一段区间中小于k的数都变成k.操作的最后询问全局和. 注释:$1\le n\le 4\cdot 10^4$. 想法: ...
- cogs 315. [POJ3255] 地砖RoadBlocks
315. [POJ3255] 地砖RoadBlocks ★★★ 输入文件:block.in 输出文件:block.out 简单对比时间限制:1 s 内存限制:128 MB Descri ...
- 查看当前Java进程工具jps(转)
jps是JDK提供的一个查看当前Java进程的小工具, 可以看做是JavaVirtual Machine Process Status Tool的缩写.非常简单实用. 命令格式: jps [optio ...
- monitor cursor
客户提出了一个需求,他们改进了自己的程序,想证明程序现在open cursor变少了,也就是说程序运行过程中 open cursor的峰值变小了. 我写了一个脚本来进行这个监控. oracle[aaa ...
- Android 应用启动动画代码
requestWindowFeature(Window.FEATURE_NO_TITLE);//设置无标题 setContentView(R.layout.activity_main); getWin ...
- c++ 11 thread 初试
最新的 c++11标准整合进了 线程支持.以下写一个小程序測试一下. 測试代码: #include <iostream> #include <thread> void hell ...
- iOS 运行时添加属性和方法
第一种:runtime.h里的方法 BOOL class_addProperty(Class cls, const char *name, const objc_property_attribute_ ...
- Cocos2d-x飞机大战教程笔记
咳咳~跟着大神的教程学做Cocos2d-x的飞机大战...鉴于我是那种跟着教程都会出非常多错的人,所以还是一路跟着做些笔记比較好.并且因为是用课余时间,所以仅仅能断断续续地做,写下来也好让自己别忘记~ ...
- HDU 3656 二分+dlx判定
Fire station Time Limit: 10000/5000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Others) To ...