._left{
position: relative;
margin-top: 40rpx;
width: 40%;
height: 350rpx;
border-radius: 12rpx;
text-align: center;
font-size: 26rpx;
background-color: #FCF2D7;
color: #9F7F43;
border: 2rpx solid #FFC11B;
} ._left:before{
content: '';
display: inline-block;
position: absolute;
right: 0;
top: 0;
width: 0;
height: 0;
border-top: 28px solid #FBCF6B;
border-left: 28px solid transparent; }
._left:after{
content: '';
position: absolute;
right: 1px;
top: 5px;
width: 8px;
height: 4px;
display: inline-block;
border: 1px solid #fff;
border-width: 0 0 1px 1px;
transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
vertical-align: baseline;
}

微信小程序 div选中效果的更多相关文章

  1. 微信小程序的动画效果

    前言 由于公司计划有变,所以从H5页面改成去小程序写.所以在着手开发小程序.本人也不是什么前端高手,只是一名写后端偶尔写写前端的渣渣.请前端大神们勿喷. 一.什么是微信小程序? 小程序在我的理解中只是 ...

  2. 微信小程序CheckBox选中事件

    1.微信小程CheckBox选中问题 <checkbox-group bindchange="checkboxChange" data-index="{{index ...

  3. 微信小程序button选中改样式-实现单选/多选

    小程序实现多button单选/多选 红色为选中状态 单选 多选 ①wxss /* pages/button-select/button-select.wxss */ .button_container ...

  4. 微信小程序之楼层效果

    今天做了一个小程序实现一个楼层效果  带大家分享下经验和api的使用吧 如图 将左边和右边各分了一个组件  目录如下 其中list页面是这个楼层效果的页面 components是组成这个页面的两个组件 ...

  5. 微信小程序跑马灯效果--基于CSS3 animation 及 基于JS

    如果本文对你有用,请爱心点个赞,提高排名,帮助更多的人.谢谢大家!❤ 如果解决不了,可以在文末进群交流. 基于CSS3主要代码实现 效果图: 视图模板wxml中: <view class=&qu ...

  6. 微信小程序切换选中状态

     实现的主要思路是根据每一项的index值,动态改变idx值,当index==idx值的时候,添加点击选中样式的类名. wxml: <scroll-view scroll-x="tru ...

  7. 微信小程序单个倒计时效果

    var end_time = grouponList.expire_time.replace(/-/g, '/') grouponcountdown(that, end_time) //适用于商品列表 ...

  8. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  9. 微信小程序源码推荐

    wx-gesture-lock  微信小程序的手势密码 WXCustomSwitch 微信小程序自定义 Switch 组件模板 WeixinAppBdNovel 微信小程序demo:百度小说搜索 sh ...

随机推荐

  1. LCT(Link-Cut-Tree)

    LCT(Link-Cut-Tree) LCT维护一个森林,即把每个节点用splay维护,可以进行许多操作: 查询.修改链上的信息 随意指定原树的根(即换根) 动态连边.删边 合并两棵树.分离一棵树 动 ...

  2. springboot多个service互相调用的事务处理(十三)

    在一个service的方法A中,调用另一个service的方法B,方法A和方法B均存在数据库插入操作,需要添加如下配置: @Transactional(rollbackFor = Exception. ...

  3. python的模拟算法--打印任务

    模拟算法:打印任务 Queue来实现 队列(queue)是一种有次序的数据集合,其特征是新数据项的添加总发生在一端(通常称为"尾rear"端)而现存数据项的移除总发生在另一端(通常 ...

  4. redis数据类型及应用场景

    0.key的通用操作 KEYS * keys a keys a* 查看已存在所有键的名字 ****TYPE 返回键所存储值的类型 ****EXPIRE\ PEXPIRE 以秒\毫秒设定生存时间 *** ...

  5. Springboot 配置文件、隐私数据脱敏的最佳实践(原理+源码)

    大家好!我是小富- 这几天公司在排查内部数据账号泄漏,原因是发现某些实习生小可爱居然连带着账号.密码将源码私传到GitHub上,导致核心数据外漏,孩子还是没挨过社会毒打,这种事的后果可大可小. 说起这 ...

  6. Vue+SpringBoot前后端分离中的跨域问题

    在前后端分离开发中,需要前端调用后端api并进行内容显示,如果前后端开发都在一台主机上,则会由于浏览器的同源策略限制,出现跨域问题(协议.域名.端口号不同等),导致不能正常调用api接口,给开发带来不 ...

  7. React Class组件生命周期

    一.react组件的两种定义方式 1.函数组件,简单的函数组件像下面这样,接收Props,渲染DOM,而不关注其他逻辑 function Welcome(props) { return <h1& ...

  8. 如何在idea中配置Tomcat服务器

    .IDEA 中动态 web 工程的操作         a)IDEA 中如何创建动态 web 工程        1.创建一个新模块: 2.选择你要创建什么类型的模块 3.输入你的模块名,点击[Fin ...

  9. Deepin Pwn环境的配置

    要学习Pwn  Pwn环境那是必不可少滴! 我是新手,我也弄了好久,这里把经验分享给大家!这里感谢I春秋的"知世"老师的脚本!虽然写的不是很完美.还得我自己动手修改!PS:http ...

  10. Reuse Sonar Checkstyle Violation Report for Custom Data Analysis

    Write a violation rules file; Import it into Sonar as a Quality Profile named as "MyRules" ...