>微信小程序的布局css样式 参考自  珺L

文字

width: fit-content;
font-size:20px;      /*设置文字字号*/
color:red;           /*设置文字颜色*/
font-weight:bold;    /*设置字体加粗*/
border:1px solid red;/*添加边框样式(粗细为1px, 颜色为红色的实线)*/

font-family:"宋体";   /*设置字体为宋体*/

----------------------------------------------------------------------------------------

排版

font-style:italic;    /*文字排版--斜体*/
text-decoration:underline;   /*文字排版--下划线*/
text-decoration:line-through;/*文字排版--删除线*/
text-indent:2em;             /*段落排版--缩进*/
line-height:1.5em;           /*段落排版--行间距(行高)*/
letter-spacing:50px;         /*段落排版--中文字间距*/
word-spacing:50px;           /*字母间距*/

text-align:center;  right ; left ;  /*段落排版--对齐*/

----------------------------------------------------------------------------------------

元素

display:inline-flex; /*将对象作为内联块级弹性伸缩盒显示*/
display:block;        /*设置为块状元素*/
display:inline;        /*设置为内联元素*/

display:inline-block;     /*设置为内联块状元素*/

-----------------------------------------------------------------------------------------

换行与位置

word-break:keep-all;        /* 不换行 */ 
white-space:nowrap;         /* 不换行 */ 
vertical-align:middle;     /*把此元素放置在父元素的中部。*/

-----------------------------------------------------------------------------------------

边框

border-style(边框样式)常见样式有:  (border-color,border-width) 边框相关设置
dashed(虚线)| dotted(点线)| solid(实线)。
border-bottom border-top border-right border-left 上下左右线单独设置

-----------------------------------------------------------------------------------------

上下左右边距

box-sizing: border-box; //当使用padding的时候不影响大小
padding-top padding-right padding-bottom padding-left
margin-top margin-right margin-bottom margin-left (margin:10px 10px 10px 10px; top、right、bottom、left)

微信小程序 text属性设置 WXSS样式的更多相关文章

  1. 微信小程序通过background-image设置背景图片

    微信小程序通过background-image设置背景:只支持线上图片和base64图片,不支持本地图片:base64图片设置步骤如下:1.在网站http://imgbase64.duoshitong ...

  2. 微信小程序四(设置底部导航)

    好了 小程序的头部标题 设置好了,我们来说说底部导航栏是如何实现的. 我们先来看个效果图 这里,我们添加了三个导航图标,因为我们有三个页面,微信小程序最多能加5个. 那他们是怎么出现怎么着色的呢?两步 ...

  3. 微信小程序尺寸单位rpx以及样式相关介绍

    rpx单位是微信小程序中css的尺寸单位,rpx可以根据屏幕宽度进行自适应.规定屏幕宽为750rpx.如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375p ...

  4. 【微信小程序】动态设置图片大小

    我们都知道微信小程序的组件image是用来显示图片的,它有一下几个属性:1.src              图片资源地址2.mode          图片裁剪.缩放的模式3.binderror   ...

  5. 微信小程序的网络设置,及网络请求:wx.request(OBJECT)

    Md2All 一个Markdown在线转换工具 网址:http://md.aclickall.com 微信公众号:颜家大少本文所用排版工具:http://md.aclickall.com 支持通用的M ...

  6. 微信小程序全局属性

    通用全局属性:(前端也有) Infinity 代表正的无穷大的数值. NaN 指示某个值是不是数字值. undefined 指示未定义的值. 通用全局函数:(前端也有) decodeURI() 解码某 ...

  7. 微信小程序 body属性的问题

    微信小程序里面没有了body这个节点了,取而代之的是page

  8. 学习微信小程序之css4设置颜色,单位表示,字体样式

    颜色的设置可以通过RGB设置 可以直接通过英文单词设置 可以通过16进制来设置 长度单位: 字体样式: 设置字体样式 字体粗细 设置字体风格 设置字间距

  9. 微信小程序入门四: 导航栏样式、tabBar导航栏

    实例内容 导航栏样式设置 tabBar导航栏 实例一:导航栏样式设置 小程序的导航栏样式在app.json中定义. 这里设置导航,背景黑色,文字白色,文字内容测试小程序 app.json内容: { & ...

随机推荐

  1. netty入坑第一步:了解netty和编写简单的Echo服务器和客户端

    早期java API通过原生socket产生所谓的"blocking",大致过程是这样 这种的特点是每次只能处理一个请求,如果要实现多个请求并行,就还要分配一个新的线程来给每个客户 ...

  2. js对象按某个字段排序

    var arr = [ {name:'zopp',age:0}, {name:'gpp',age:18}, {name:'yjj',age:8} ]; function compare(propert ...

  3. Asp.net core 环境配置

    参考: 在 ASP.NET Core 中使用多个环境 ASP.NET Core 中的配置 在项目的 Properties\launchSettings.json中可以配置多个环境 { "ii ...

  4. mysql 开发进阶篇系列 44 物理备份与恢复( 热备份xtrabackup 工具介绍)

    一.概述 物理备份和恢复又分为冷备份和热备份.与逻辑备份相比,它最大优点是备份和恢复的速度更快.因为物理备份的原理都是基于文件的cp. 1.1 冷备份 冷备份就是停掉数据库服务.这种物理备份一般很少使 ...

  5. CentOS 7的安装详解

    不多说,直接上干货! CentOS 6.5的安装详解 主流:  目前的Linux操作系统主要应用于生产环境, 主流企业级Linux系统仍旧是RedHat或者CentOS. 免费: RedHat 和Ce ...

  6. 基于 LWIP 建立 TCP Server 与主机通信实验

    LWIP 版本:2.0.3 上一篇文章是写如何将 LWIP 移植到板子上,今天晚上记录基于 LWIP 实现与主机的网络通信. 先是打开了原子的实验例程,大概浏览了一遍,觉得 TCP 网络网络通信也就是 ...

  7. cobbler单台服务器实现批量自动化安装不同版本系统-技术流ken

    前言 在上一篇博文<cobbler批量安装系统使用详解-技术流ken>中已经详细讲解了cobbler的使用以及安装,本篇博文将会使用单台cobbler实现自动化批量安装不同版本的操作系统. ...

  8. 本人开源项目 Lu-Rpc

    Lu-Rpc 是个专为学习者准备的 RPC 框架, 初始架构非常简单, 可供初学者扩展和学习. Lu 可以认为是中文世界的撸, 即撸 Rpc--- 造个 Rpc 轮子. Lu-Rpc 架构图如下: L ...

  9. shell编程基础(六): 透彻解析查找命令find

    find 由于find具有强大的功能,所以它的选项也很多,其中大部分选项都值得我们花时间来了解一下.即使系统中含有网络文件系统( NFS),find命令在该文件系统中同样有效,只要你具有相应的权限. ...

  10. 我的python渗透测试工具之主机嗅探

    嗅探工具的主要目标是基于UDP发现目标网络中的存活主机,选择UDP的原因是UDP访问过程开销小. 由于很多的操作系统在处理UDP端口的闭合时都会存在一个共性,我们也正是利用这个共性来开展确定此IP上是 ...