最近微信推出了微信小程序,为此我学了几天,基本了解了组件及简单语法,但是今天我自己想要独立写一个demo时,忽然发现难道我的不是微信小程序的语法(我以前是iOS 开发,不用css),而是css样式的设计,为此我决定学习css

一:内联样式,css可以同过内联样式设置属性
如下:
<text syle= "color:red;fout-size:12px"></text>
设置text的颜色为红色,文字大小为12px
二:小程序好像不支持嵌入样式
&lt;style type = "css/text"&gt;
view {background:red;}
&lt;/style&gt;

<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>

&lt;!--后面加空格表示遵循两个类,下面表示遵循class_top,class_model两个类--&gt;
<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>

初学微信小程序的更多相关文章

  1. 初学微信小程序 TodoList

    微信小程序的学习 微信小程序的开始尝试 TodoList 微信开发者工具生成 目录如下: . |-- app.js |-- app.json |-- app.wxss |-- pages | |-- ...

  2. 初学微信小程序——配置问题(1)

    一.注册: 微信小程序账号注册:登录https://mp.weixin.qq.com  点击“立即注册”->”小程序” 注册完成后,下载微信小程序开发者工具: 依次点击:“首页”->“文档 ...

  3. 初学微信小程序——配置问题(2)

    六.生命周期函数:   在微信公众平台指南中搜索生命周期,找到页面生命周期 比如,我打开cate.js并编写,代码如下: ** * 生命周期函数--监听页面加载 */ onLoad: function ...

  4. 小程序——微信小程序初学踩过的坑

    微信小程序初学踩过的坑 一.前言     最近因为某些需要和个人兴趣打算开发一下微信小程序,经过在官方网站上的基本了解,我大体知道了微信小程序开发的大致过程,其实最本质的就是MVVM,借用了很多模式上 ...

  5. 《微信小程序七日谈》- 第四天:页面路径最多五层?导航可以这么玩

    <微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩 微信小 ...

  6. 《微信小程序七日谈》- 第二天:你可能要抛弃原来的响应式开发思维

    <微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩 上篇文 ...

  7. 《微信小程序七日谈》- 第一天:人生若只如初见

    <微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩 微信小 ...

  8. 《微信小程序七日谈》- 第五天:你可能要在登录功能上花费大力气

    <微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩: 第五 ...

  9. 《微信小程序七日谈》- 第六天:小程序devtool隐藏的秘密

    <微信小程序七日谈>系列文章: 第一天:人生若只如初见: 第二天:你可能要抛弃原来的响应式开发思维: 第三天:玩转Page组件的生命周期: 第四天:页面路径最多五层?导航可以这么玩: 第五 ...

随机推荐

  1. java环境配置

    一.下载安装sdk jdk和jre的区别: jdk:是编译环境(编译器),把java文件编译成class文件 jre:是运行环境(运行器),执行class文件需要使用jre eclipse开发出jav ...

  2. Alpha阶段测试报告

    测试说明 APP中前后端交互的接口主要有两种,一种是游戏开始前获取信息的HTTP请求接口,这种接口可以看成是静态的,比较简单:另外一种就是游戏过程中进行实时通信的Websocket请求接口,因为这是在 ...

  3. 配置linux----------------ip

    在终端中输入 vi /etc/sysconfig/network-scripts/ifcfg-eth0 =================================== DEVICE=" ...

  4. Angular.js内置的63个指令

  5. C# 的TCP Socket (同步方式)

    简单的c# TCP通讯(TcpListener) C# 的TCP Socket (同步方式) C# 的TCP Socket (异步方式) C# 的tcp Socket设置自定义超时时间 C# TCP ...

  6. 在.net中使用GAC

    转自:http://blog.log4d.com/2011/01/gac/ GAC GAC是什么?是用来干嘛的?GAC的全称叫做全局程序集缓存,通俗的理解就是存放各种.net平台下面需要使用的dll的 ...

  7. QT读取文本(字符串)最后一行的方法

    QString str; QTextStream ts(&str); str = this->toPlainText(); ts.seek(str.lastIndexOf("- ...

  8. PHP读写文件

    一:读取文件 例1: $xml = ""; //打开文件 $f = fopen('http://app.eyuebus.com/Public/apk/version.xml', ' ...

  9. Unity3D 搭建优雅的UI框架

    为什么要使用UI框架?直接使用NGUI或UGUI一拖一拉直接搭载出界面不就行了? 我相信很多小白,包括我在刚学习Unity3D UI的时候都这样想过. 我的第一款款Unity2D游戏<山地赛车& ...

  10. 错误 Metadata file 'C:\Common\bin\Debug\Common.dll' could not be found

    一个通用方法de类库/总是报这个错误/很明显就是没有成功生成程序集... 但是就是找不到哪里的错误!!!! 如果是代码写错的话,可能会直接提示在哪个文件中哪行代码写错了,然后dll生成不了,但是这个错 ...