1.WXSS(WeiXin Style Sheets)是一套用于小程序的样式语言,用于描述WXML的组件样式,也就是视觉上的效果。WXSS与Web开发中的CSS类似。为了更适合小程序开发,WXSS对CSS做了一些补充以及修改。

2.项目公共样式:根目录中的app.wxss为项目公共样式,它会被注入到小程序的每个页面。页面样式:与app.json注册过的页面同名且位置同级的WXSS文件。

3.页面样式

4.其它样式:其它样式可以被项目公共样式和页面样式引用。

5.在WXSS中,引入了rpx(responsive pixel)尺寸单位。引用新尺寸单位的目的是,适配不同宽度的屏幕,开发起来更简单。

6.WXSS引用:@import './test_0.wxss'

7.WXSS内联样式与Web开发一致。

8.选择器:

类型 选择器 样例 样例描述
类选择器 .class .intro 选择所有拥有 class="intro" 的组件
id选择器 #id #firstname 选择拥有 id="firstname" 的组件
元素选择器 element view checkbox 选择所有文档的 view 组件和所有的 checkbox 组件
伪元素选择器 ::after view::after 在 view 组件后边插入内容
伪元素选择器 ::before view::before 在 view 组件前边插入内容

微信小程序开发6-WXSS的更多相关文章

  1. 解决微信小程序开发中wxss中不能用本地图片

    微信小程序开发中wxss中不能用本地图片,我们可以用将我们的图片传到服务器上,然后直接引用在线地址.但是当我们没有服务器时,我们可以用"图床",这个具体可以百度.这里我们用第二种方 ...

  2. 微信小程序开发:学习笔记[3]——WXSS样式

    微信小程序开发:学习笔记[3]——WXSS样式 快速开始 介绍 WXSS(WeiXin Style Sheets)是一套用于小程序的样式语言,用于描述WXML的组件样式,也就是视觉上的效果. WXSS ...

  3. 微信小程序开发心得

    微信小程序也已出来有一段时间了,最近写了几款微信小程序项目,今天来说说感受. 首先开发一款微信小程序,最主要的就是针对于公司来运营的,因为,在申请appid(微信小程序ID号)时候,需要填写相关的公司 ...

  4. 微信小程序开发工具使用与设计规范(二)

    [未经作者本人同意,请勿以任何形式转载] 上一篇文章主要分析了微信小程序应用场景和优劣势.本篇你可以学习到: 如何使用小程序开发工具写一个Hello World 微信小程序设计规范 微信小程序项目结构 ...

  5. 三言两语之微信小程序开发初体验(1)

    一.前情   直接切入主题,微信发布了小程序,前端开发者表示,如果不会微信小程序的开发感觉就跟不上时代了,先解答几个容易出现歧义的问题 小程序就叫小程序,不叫应用号,因为apple不准,哈哈 小程序是 ...

  6. 剖析简易计算器带你入门微信小程序开发

    写在前面,但是重点在后面 这是教程,也不是教程. 可以先看Demo的操作动图,看看是个什么玩意儿,GitHub地址(https://github.com/dunizb/wxapp-sCalc) 自从微 ...

  7. 微信小程序开发入门教程

    做任何程序开发要首先找到其官方文档,微信小程序目前还在邀请内测阶段,目前官方放出了部分开发文档,经过笔者一天的查看和尝试,感觉文档并不全面,但是通过这些文档已经能够看出其大概面貌了.闲话不多说,我们先 ...

  8. 微信小程序开发 -- 02

    微信小程序开发 --02 微信小程序在开发中,难度系数不是很大,其中应用的技术也是web开发中常用的技术,虽然在微信开发者工具中的叫法与常见的web开发的叫法不太一样. 首先,在微信小程序开发中,代码 ...

  9. 微信小程序开发-新闻列表之新闻列表绑定

    微信小程序开发-新闻列表之新闻列表绑定开发教程: 1.效果图预览 2.准备工作 在拿到效果图后不要先急着去写代码,而是要去分析一下页面的整体结构,用什么方式定位和布局.小程序里建议使用flex布局,因 ...

  10. 从零入手微信小程序开发

    前言: 哈哈,发现我写的随笔都是项目驱使的.当然,这篇也是项目驱使的咯,前段时间领导在玩微信时候发现了微信小程序的好处,流程,切换速度快等,然后就让小弟研究研究小程序的实现. 补充下,博客大多都是处理 ...

随机推荐

  1. 总博客 wjyyy

    更多文章可见http://www.wjyyy.top/

  2. 九省联考 2018 Day 1 复现

    前言 今年省选还有 15 天.每天针对性刷题学知识点有点枯燥,想到真题还没刷,就对着 pdf 做了一遍. A. 一双木棋 去年省选得了 25,应该是 \(n=2,m=2\) 的贪心和 \(m=1\) ...

  3. Python2获取网页标题

    Python获取网页标题 使用Python2.x的urllib2和lxml,速度应该还快于BeautifulSoup4(话说回来,为什么大家都要用BS4呢?一个XPATH不就完了吗) 没有安装过的,用 ...

  4. python的socket.recv函数陷阱

    目录 前言 一个粘包实验 执行结果 排错思路 解决和总结 前言 惯例练习历史实验,在编写tcp数据流粘包实验的时候,发现一个奇怪的现象.当远程执行的命令返回结果很短的时候可以正常执行,但返回结果很长时 ...

  5. c#移位运算符("<<"及">>")详细说明

    以前感觉移位运算符自己挺明白的,也许是学的时间长了,后来一看,忘得差不多了.现在参考一些网上的学习资料,将位移运算符整理一下,作为知识点总结,也算个积累.在讲移位运算符之前,先简单补充一下原码与补码的 ...

  6. Hibernate3.3.2_ID生成策略

    1,xml生成id generator:常用四个:native.identity.sequence.uuid. Annotation: 1,@GeneratedValue: a)自定义ID b)AUT ...

  7. VisualSVN Server提供程序无法执行所尝试的操作 0x80041024

    VisualSVN安装后没有提供VisualSVN Server Manager的快捷方式,如下图: 可以在安装目录的bin文件夹下找到VisualSVN Server.msc,添加快捷方式.建议Vi ...

  8. eclipse修改Properties资源文件的默认编码

    在eclipse下,打开window-->preferences-->general-->content Types-->java Properties File 将其编码方式 ...

  9. Go语言学习笔记二: 变量

    Go语言学习笔记二: 变量 今天又学了一招如何查看go的版本的命令:go version.另外上一个笔记中的代码还可以使用go run hello.go来运行,只是这种方式不会生成exe文件. 定义变 ...

  10. msyql int(x) 中的x

    先看一个mysql表结构 Sql代码 CREATE   TABLE  `test` ( `TYPEID` int (2) ) ENGINE=MyISAM CHARSET=latin1; Sql代码   ...