3-2 官方文档整理-视图层-WXSS

【参考内容】:可参考W3C School 中CSS部分:链接地址: http://www.w3school.com.cn/h.asp

【作用】

  WXSS(WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式

  WXSS 用来决定 WXML 的组件应该怎么显示。

【尺寸单位】

  rpx(responsive pixel): 可以根据屏幕宽度进行自适应。规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。

【样式导入】

  使用@import语句可以导入外联样式表,@import后跟需要导入的外联样式表的相对路径,用;表示语句结束。 

1 /** common.wxss **/
2 .small-p {
3   padding:5px;
4 }
1 /** app.wxss **/
2 @import "common.wxss";
3 .middle-p {
4   padding:15px;
5 }

【内联样式】

1 <view style="color:{{color}};" />
2 <view class="normal_view" /> #类选择器

类选择器

.class .intro 选择所有拥有 class="intro" 的组件
#id #firstname 选择拥有 id="firstname" 的组件
element view 选择所有 view 组件
element, element view, checkbox 选择所有文档的 view 组件和所有的 checkbox 组件
::after view::after 在 view 组件后边插入内容
::before view::before 在 view 组件前边插入内容

原文地址:https://www.cnblogs.com/ailex/p/9636105.html

时间: 2024-10-10 23:16:59

3-2 官方文档整理-视图层-WXSS的相关文章

Es官方文档整理-2.分片内部原理

Es官方文档整理-2.分片内部原理 1.集群 一个运行的Elasticsearch实例被称为一个节点,而集群是有一个或多个拥有相同claster.name配置的节点组成,他们共同承担数据和负载压力,当有节点加入或从集群中移除的时候,集群或自动平局分布所有数据. 当一个节点被选举成为主节点时,他哈不负责额管理集群范围内的所有变更,例如增加.删除索引,或者增加.删除节点等.而主节点不涉及文档级别的变更和搜索操作,所以集群只有一个主节点,即使流量增加,他也不会成为瓶颈.任何节点都可以成为主节点. 3.

3-1 官方文档整理-视图层-WXML文件

[视图层文件组成]: 视图层由 WXML 与 WXSS 编写,由组件来进行展示. WXML(WeiXin Markup language) 用于描述页面的结构. WXS(WeiXin Script) 是小程序的一套脚本语言,结合 WXML,可以构建出页面的结构. WXSS(WeiXin Style Sheet) 用于描述页面的样式. [WXML] [数据绑定]:数据绑定语法:使用双大括号将需要替换的对象括起来,下面的代码,界面文件中的{{message}}会替换为"Hello MINA"

Django官方文档之Model层

一.模型继承 1.抽象基类继承: 抽象基类: 抽象基类主要是作为一个信息集合,用在许多模型拥有共同信息的场合,本质上只是一个存储信息的容器,数据库中不创建表结构,不能单独使用,子类通过继承来获得父                 亲基类的字段和元类型数据,通过设置Meta类的abstract=True属性来声明为抽象基类,否则,不会自动变为抽象基类,现举例如下: 1 from django.db import models 2 3 class CommonInfo(models.Model):

微信小程序官方文档错误整理

大致看了一遍微信小程序文档,发现有几处微小的错误,但瑕不掩瑜.记录下,以后发现了还会继续在此添加.如果有记录不对的,请及时指出错误. 1.视图层->WXSS->尺寸单位 明显错误,应该为 1px=2.34rpx 2.视图层->WXML->引用->include描述 有错别字 3.视图层->WXML->事件->事件绑定 "点击 inner view 会先后触发handleTap1和handleTap2",个人感觉应该是先后触发handleT

Spring 4 官方文档学习(十一)Web MVC 框架之resolving views 解析视图

接前面的Spring 4 官方文档学习(十一)Web MVC 框架,那篇太长,故另起一篇. 针对web应用的所有的MVC框架,都会提供一种呈现views的方式.Spring提供了view resolvers,可以让你在浏览器中render model,而不必绑定到某种特定的view技术上.开箱即用,例如,Spring可以让你使用JSPs.Velocity目标和XSLT views.See Chapter 23, View technologies for a discussion of how

hbase官方文档(转)

Apache HBase™ 参考指南  HBase 官方文档中文版 Copyright © 2012 Apache Software Foundation.保留所有权利. Apache Hadoop, Hadoop, MapReduce, HDFS, Zookeeper, HBase 及 HBase项目 logo 是Apache Software Foundation的商标. Revision History Revision 0.95-SNAPSHOT 2012-12-03T13:38 中文版

一起学微软Power BI系列-官方文档-入门指南(3)Power BI建模

我们前2篇文章:一起学微软Power BI系列-官方文档-入门指南(1)Power BI初步介绍 和一起学微软Power BI系列-官方文档-入门指南(2)获取源数据 中,我们介绍了官方入门文档与获取数据等基本知识.今天继续给大家介绍官方文档中,最核定的一个步骤,建模,不管是在Power BI还是在Tableau中,建模都是一个必不可少的步骤,包括传统的Power Privot中,也需要建模这个过程.建模的过程是一个不断演变和需要不断总结经验的过程,和我们传统的关系类型数据库设计有一些类似. 本

Android 线性布局(LinearLayout)相关官方文档 - 参考部分

太阳火神的美丽人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一致"创作公用协议 转载请保留此句:太阳火神的美丽人生 -  本博客专注于 敏捷开发及移动和物联设备研究:iOS.Android.Html5.Arduino.pcDuino,否则,出自本博客的文章拒绝转载或再转载,谢谢合作. Android 官方文档线性布局相关资源链接汇总如下: android-sdk-macosx-4.4.2/docs/guide/topics/ui

Django 1.9.6 官方文档 第二部分(中文翻译)

注:最近开始学习Python的Django框架,为了督促学习,强迫自己翻译官方的文档,既是一种学习,也是一种积累!由于经验不足,错误肯定不少,请大家不吝指教!原创内容,转载请注明出处. Django官方文档 第二部分:新手入门 (之所以从第二部分开始,是因为第一部分是整个官方文档结构图和导引,有空我会翻译出来补全.) 2.1 Django概述 Django诞生于快节奏的新闻编辑室环境,它被设计成快速.简单的通用网站开发工具. 本文档的目的是让你获得足够的基础知识去理解Django是如何工作的,它