没有合适的资源?快使用搜索试试~ 我知道了~
微信小程序 CSS 选择器::after和::before的简单使用
5星 · 超过95%的资源 需积分: 9 3 下载量 5 浏览量
2021-03-29
17:27:41
上传
评论 1
收藏 72KB PDF 举报
温馨提示
试读
3页
前言 前两天看文档看到选择器那块儿的时候,前面4个基本都能理解:.class,#id,element,element, element,但后面两个::after和::before(文档中说,分别表示在view 组件的后面和前面插入内容),表示有点没有理解。于是上网仔细查了下。以下是笔记 (此图片来源于网络,如有侵权,请联系删除! ) image 基本概念 ::before 用法:view::before,表示在该view组件的前面加入内容 ::after 用法:view::after,表示在该view组件的后面加入内容 这里是双冒号,不是单冒号。单冒号是CSS2的内容,双冒号是CSS3
资源推荐
资源详情
资源评论
微信小程序微信小程序 CSS 选择器选择器::after和和::before的简单使用的简单使用
前言前言
前两天看文档看到选择器那块儿的时候,前面4个基本都能理解:.class,#id,element,element, element,但后面两
个::after和::before(文档中说,分别表示在view 组件的后面和前面插入内容),表示有点没有理解。于是上网仔细查了下。
以下是笔记
(此图片来源于网络,如有侵权,请联系删除! )
image
基本概念基本概念
::before 用法:view::before,表示在该view组件的前面加入内容
::after 用法:view::after,表示在该view组件的后面加入内容
这里是双冒号,不是单冒号。单冒号是CSS2的内容,双冒号是CSS3的内容。当然微信小程序也是兼容CSS2的写法的
这种在组件的前面和后面加入内容,其实有点类似Android中的给TextView四周加图片的做
法,setCompoundDrawables(Drawable left, Drawable top, Drawable right, Drawable bottom)(原谅我这里有点强行建立联系
的奇怪思路)
用法用法
wxml
1. <view class="container">
2. <view class="price">{{price}}</view>
3. </view>
wxss
1. .container {
2. width: auto;
3. margin: 30rpx;
4. background-color: #fff;
5. text-align: center;
6. }
weixin_38722184
- 粉丝: 5
- 资源: 899
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功
- 1
- 2
前往页