用border做一个移动端常见的返回按钮
第一步
.hs1{
float: left;
.mt(.25rem);
.ml(.12rem);
width: .3rem;
height: .3rem;
border-top: 2px solid #fff; //关键
border-left: 2px solid #fff; //关键
color: #fff;
}
<a href="javascript:;" class="hs1"></a>
效果如图
第二步:运用css3 tranform的rotateZ
.hs1{
float: left;
.mt(.25rem);
.ml(.12rem);
width: .3rem;
height: .3rem;
border-top: 2px solid #fff;
border-left: 2px solid #fff;
color: #fff;
-webkit-transform: rotateZ(-45deg);
-moz-transform: rotateZ(-45deg);
-ms-transform: rotateZ(-45deg);
-o-transform: rotateZ(-45deg); //上面均是兼容写法
transform: rotateZ(-45deg);
}
效果如图:
用border做一个移动端常见的返回按钮的更多相关文章
- uwp - 做一个相对炫酷的动画按钮/按钮动画
原文:uwp - 做一个相对炫酷的动画按钮/按钮动画 看腻了系统自带的button animation何不尝试下自定义一个较为炫酷的动画顺便提升用户体验.效果图: 动画分为几个部分,分别是:内圆从中心 ...
- 【移动端debug-6】如何做一个App里的web调试小工具
原文链接:如何做一个App里的web调试小工具 我们知道现在hybrid app非常流行,在这样的app里,h5页面是应用非常广泛的.相对于以往在pc端开发的网页,放在app里的网页由于无法直接使用桌 ...
- vue实现一个移动端屏蔽滑动的遮罩层
在扯废话浪费大家的时间之前,先上个代码好了,使用vue实现起来很简单-- <div class="overlayer" @touchmove.stop > </d ...
- 【移动端 Web】怎么循序渐进地开发一个移动端页面
1. 移动页面开发基础 1.1 像素——什么是像素 像素是 Web 页面布局的基础,那么到底什么才是一个像素呢? 像素:一个像素就是计算机屏幕所能显示一种特定颜色的最小区域.这是像素的概念,实际上,W ...
- 做一个懒COCOS2D-X程序猿(一)停止手打所有cpp文件到android.mk
前言:”懒”在这里当然不是贬义词,而是追求高效,拒绝重复劳动的代名词!做一个懒COCOS2D-X程序猿的系列文章将教会大家在工作中如何偷懒,文章篇幅大多较短,有的甚至只是几行代码,争取把懒发挥到极致! ...
- [转]jsPlumb插件做一个模仿viso的可拖拉流程图
原贴:https://www.cnblogs.com/sggx/p/3836432.html 前言 这是我第一次写博客,心情还是有点小小的激动!这次主要分享的是用jsPlumb,做一个可以给用户自定义 ...
- 【权限维持】window服务端常见后门技术
0x00 前言 未知攻焉知防,攻击者在获取服务器权限后,通常会用一些后门技术来维持服务器权限,服务器一旦被植入后门,攻击者如入无人之境.这里整理一些window服务端常见的后门技术,了解攻击者的常见后 ...
- 强哥的分享--如何使用Spring Boot做一个邮件系统
http://springboot.fun/ actuator是单机.集群环境下要使用Spring Boot Admin将各个单机的actuator集成越来 mvn clean package -Dm ...
- 使用Vue+Django+Ant Design做一个留言评论模块
使用Vue+Django+Ant Design做一个留言评论模块 1.总览 留言的展示参考网络上参见的格式,如掘金社区: 一共分为两层,子孙留言都在第二层中 最终效果如下: 接下是数据库的表结构,如下 ...
随机推荐
- C#下丢掉.asmx文件的WebService的实现
C#下丢掉.asmx文件的WebService的实现 我在用.net实现Webservice的时候发现需要一个没有任何用处的.asmx文件,但是却没法删除,这两天我实现一个通过接口时想实现dll直接部 ...
- 导入excle数据
导入excle数据 1.if (File.Exists(strFileName)) // 当文件存在时 { m_fileName = strFi ...
- NUTZ中处理系统未捕获异常
关键内容 mvc-chain.js ViewProcessor ai.setFailView(“redirect:/sysError.html”); log.error(this.trrowableT ...
- ELK采集之nginx 之高德地图出城市IP分布图
1.采用拓扑: 角色扮演: Agent:采用logstash,IP:192.168.10.7 Redis队列: IP:192.168.10.100 Indexer:logstash,IP:192.16 ...
- NodeJS 实现 客户端 js 加密
NodeJS 实现 客户端 js 加密 思路: 服务端渲染业务代码js => 前后端约定加密算法 => 业务代码进行签名 => 客户端解密业务代码 => eval 执行 Nod ...
- iOS之崩溃处理:This application is modifying the autolayout engine from a background thread
一.错误提示 今天在开发的时候遇到一个崩溃问题,"This application is modifying the autolayout engine from a background ...
- 基于PaaS和SaaS研发的商业云平台实战 转 (今后所有的IT行业会持续集成,往虚拟化方向更快更深的发展,商业化才是这些技术的最终目的)
背景介绍 SaaS.PaaS.IaaS等云服务模式已经被大家普遍认可,在研发过程中借力一些PaaS和SaaS平台,能够提升产品的研发速度和功能稳定程度.本文将通过真实的商业平台案例-MaxWon研发实 ...
- [HMLY]11.iOS函数式编程的实现&&响应式编程概念
简介 本篇主要回顾一下--iOS函数式编程 && 响应式编程概念 ,如何一步步实现函数式编程的过程,对阅读Masonry && SnapKit源码有一定的帮助. 作为一 ...
- 【.NET】字符串处理类库
类名:DealString,方法清单列好在头上. /// 1.截取字符串,最后加3个小数点 /// 2.获得指定Url的参数的string类型值 /// 3.判断数据类型 /// 4.过滤JS标记 / ...
- sass---Sass混合宏、继承、占位符
混合宏-声明混合宏如果你的整个网站中有几处小样式类似,比如颜色,字体等,在 Sass 可以使用变量来统一处理,那么这种选择还是不错的.但当你的样式变得越来越复杂,需要重复使用大段的样式时,使用变量就无 ...