初学微信小程序
最近微信推出了微信小程序,为此我学了几天,基本了解了组件及简单语法,但是今天我自己想要独立写一个demo时,忽然发现难道我的不是微信小程序的语法(我以前是iOS 开发,不用css),而是css样式的设计,为此我决定学习css
一:内联样式,css可以同过内联样式设置属性
如下:
<text syle= "color:red;fout-size:12px"></text>
设置text的颜色为红色,文字大小为12px
二:小程序好像不支持嵌入样式
<style type = "css/text">
view {background:red;}
</style>
<view>
这是一个view
</view>
运行没有效果
三:通配符选择标签
text{
color: palegreen;
}
四,支持ID选择器
#p1{
background-color: yellow;
font-size: 25px;
}
<view id = "p1">id选择器</view>
五:class选择器
.class_top{
color: red;
}
<view class = "class_top">类选择器</view>
<!--后面加空格表示遵循两个类,下面表示遵循class_top,class_model两个类-->
<view class = "class_top class_model">类选择器</view>}
六,后代选择器
.class_kecheng{
display: flex;
flex-direction: column;
}
.kecheng text{
color: palegreen;
}
<view class="class_kecheng kecheng">
<text>美术</text>
<text>音乐</text>
<text>舞蹈</text>
</view>
七,并集选择器
text,button{
color: palegreen;
}
<text>美术</text>
<text>音乐</text>
<text>舞蹈</text>
</view>
<text>心情好</text>
<button>并集选择器</button>
八
初学微信小程序的更多相关文章
- 初学微信小程序 TodoList
微信小程序的学习 微信小程序的开始尝试 TodoList 微信开发者工具生成 目录如下: . |-- app.js |-- app.json |-- app.wxss |-- pages | |-- ...
- 初学微信小程序——配置问题(1)
一.注册: 微信小程序账号注册:登录https://mp.weixin.qq.com 点击“立即注册”->”小程序” 注册完成后,下载微信小程序开发者工具: 依次点击:“首页”->“文档 ...
- 初学微信小程序——配置问题(2)
六.生命周期函数: 在微信公众平台指南中搜索生命周期,找到页面生命周期 比如,我打开cate.js并编写,代码如下: ** * 生命周期函数--监听页面加载 */ onLoad: function ...
- 小程序——微信小程序初学踩过的坑
微信小程序初学踩过的坑 一.前言 最近因为某些需要和个人兴趣打算开发一下微信小程序,经过在官方网站上的基本了解,我大体知道了微信小程序开发的大致过程,其实最本质的就是MVVM,借用了很多模式上 ...
- 《微信小程序七日谈》- 第四天:页面路径最多五层?导航可以这么玩
<微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩 微信小 ...
- 《微信小程序七日谈》- 第二天:你可能要抛弃原来的响应式开发思维
<微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩 上篇文 ...
- 《微信小程序七日谈》- 第一天:人生若只如初见
<微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩 微信小 ...
- 《微信小程序七日谈》- 第五天:你可能要在登录功能上花费大力气
<微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩: 第五 ...
- 《微信小程序七日谈》- 第六天:小程序devtool隐藏的秘密
<微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩: 第五 ...
随机推荐
- BZOJ 2463: [中山市选2009]谁能赢呢?
2463: [中山市选2009]谁能赢呢? Time Limit: 10 Sec Memory Limit: 128 MBSubmit: 1887 Solved: 1390[Submit][Sta ...
- SQL查询为什么不推荐使用select count(*)
select count(1). count(字段名) .count(*) 的区别
- cookie 和session 的区别详解
这些都是基础知识,不过有必要做深入了解.先简单介绍一下. 二者的定义: 当你在浏览网站的时候,WEB 服务器会先送一小小资料放在你的计算机上,Cookie 会帮你在网站上所打的文字或是一些选择, 都纪 ...
- Java递归算法——三角数字(消除递归)
import java.io.*; // for I/O //类名:Params //属性: //方法: class Params //这个类的对象被压入栈中 { public int n; //用来 ...
- centos 7.0 编译安装php 5.6.7
编译安装php参考资料 MySQL PHP API http://dev.mysql.com/doc/apis-php/en/index.html nginx + php +mysql 最简单安装 官 ...
- marquee标签,好神奇啊...
<html><body><div style="height:190; margin-top:10; margin-bottom:10; width:96%; ...
- SqlServer 产生随机数
ALTER PROCEDURE [dbo].[usp_RandomNumber] ( , --随机数位数 --随机笔数 ) AS BEGIN DECLARE @T AS TABLE([Random N ...
- 关于Hibernate5.x的那点事
1.如果采用程序建表: 4.x版本: Configuration cfg = new Configuration().configure(); SchemaExport se = new Schema ...
- Dijkstra算法
Dijkstra(迪杰斯特拉)算法是典型的单源最短路径算法,用于计算一个节点到其他所有节点的最短路径.主要特点是以起始点为中心向外层层扩展,直到扩展到终点为止. /*图的邻接矩阵表示*/typedef ...
- CF memsql Start[c]UP 2.0 A
CF memsql Start[c]UP 2.0 A A. Golden System time limit per test 1 second memory limit per test 256 m ...