h5-提升移动端的响应区域
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
*{
padding: 0;
margin: 0;
}
/*提升移动端响应区域的大小*/
a{
width: 50px;
height: 50px;
display: block;
background-color: #ddd;
margin: 100px auto;
box-sizing: border-box; background-image: url("../img/login.gif");
background-size: 202px 44px;
/*设置背景偏移,参照background-origin原点,这个原点默认在容器的左上角*/
background-position: -37px -5px; /*添加padding*/
padding: 10px;
/*设置背景坐标的原点*/
/*
border-box:从border的位置开始填充背景,会与border重叠
padding-box:从padding的位置开始填充背景,会与padding重叠
content-box:从content的位置开始填充背景,会与content重叠
*/
background-origin: content-box;
/*设置内容的裁切:设置裁切,控制的是显示
border-box:显示border以及以内内容
padding-box:显示padding以及以内内容
content-box:显示content以及以内内容
*/
background-clip: content-box;
}
</style>
</head>
<body>
<a href=""></a>
</body>
</html>
h5-提升移动端的响应区域的更多相关文章
- H5微信页面开发 IOS系统 input输入框失去焦点,软键盘关闭后,被撑起的页面无法回退到原来正常的位置,导致弹框里的按钮响应区域错位
H5微信页面开发,软键盘弹起后,若原输入框被遮挡,页面整体将会上移,然而当输入框失焦,软键盘收起后,页面未恢复,导致弹框里的按钮响应区域错位. 解决方案:给输入框(或select选择框)添加失去焦点的 ...
- H5C3--background中cover,背景样式,提升响应区域+精灵图的使用
一.cover的使用 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...
- 带你使用h5开发移动端小游戏
带你使用h5开发移动端小游戏 在JY1.x版本中,你要做一个pc端的小游戏,会非常的简单,包括说,你要在低版本的浏览器IE8中,也不会出现明显的卡顿现象,你只需要关心游戏的逻辑就行了,比较适合逻辑较为 ...
- collectionviewcell 添加删除按钮 响应区域的问题
在collectionviewcell 的右上角添加了一个删除按钮,但是发现只有cell和删除按钮重合的区域才会响应点击事件 后来doctor 李说这是iOS 事件响应链的机制(http://www. ...
- 浏览器与服务端请求响应流程与HTTP协议
浏览器与服务端请求响应流程图: 1.HTTP概要 1.1. 定义 HTTP(HyperText Transfer Protocol,超文本传输协议)最早就是计算机与计算机之间沟通的一种标准协议,这种 ...
- H5手机移动端调起浏览器(qq浏览器,uc浏览器)自带分享功能实例
H5手机移动端调起浏览器(qq浏览器,uc浏览器)自带分享功能实例 (转载:https://blog.csdn.net/weixin_38787928/article/details/86741227 ...
- 支付宝H5 与网页端支付开发
在日常生活中,我们基本上都是进行微信与支付宝的支付方式尽心支付,这种方式确实大大便利了我们的生活,那么如何在我们的产品中进行微信与支付宝支付的植入开发呢? 我们先进行支付宝的H5与网页端支付开发,这里 ...
- uni-app - 支付(app支付、小程序支付、h5(微信端)支付)
App支付.小程序支付.h5(微信端)支付 APP支付(内置) appPay.js /** * 5+App支付,仅支持支付宝以及微信支付 * * 支付宝Sdk集成,微信sdk未集成 * * @para ...
- UGUI之不规则按钮的响应区域
比如一些不规则按钮最好可以设置它的响应区域.如下图所示,用Polygon Collider2D组件圈出精灵响应事件的区域. 注意 IsRaycastLocationValid 的判断区域是RectTr ...
随机推荐
- HihoCoder#1052:基因工程
HihoCoder#1052:基因工程 时间限制:1000ms 单点时限:1000ms 内存限制:256MB 描述 小Hi和小Ho正在进行一项基因工程实验.他们要修改一段长度为N的DNA序列,使得这段 ...
- c/c++ 计算屏幕的PPI
PPI(pixels per inch)是图像分辨率的单位,表示的是每英寸所拥有的像素(pixel)数目.那如何计算勒?其实PPI计算有这相应的公式,公式为:sqrt(横向的平方+纵向的平方)/屏幕尺 ...
- duilib之重写BUTTON按钮
在使用BUTTON过程中,有时候发现一些属性不够用,或要从新绘制BUTTON按钮,那该如何操作?其实很简单,只需要继承CButtonUI类就行. 创建类CMyButtonUI,继承CButtonUI, ...
- 用 Python 编写一个天气查询应用 pyqt5
效果预览: ! 一.获取天气信息 使用python获取天气有两种方式. 1)是通过爬虫的方式获取天气预报网站的HTML页面,然后使用xpath或者bs4解析HTML界面的内容. 2)另一种 ...
- HDU 4819 二维线段树
13年长春现场赛的G题,赤裸裸的二维线段树,单点更新,区间查询 不过我是第一次写二维的,一开始写T了,原因是我没有好好利用行段,说白一点,还是相当于枚举行,然后对列进行线段树,那要你写二维线段树干嘛 ...
- 长篇Essay写作凑字数的小技巧
当一个留学党面对一篇5000字的essay,写一半之后却没法继续~这类的感觉是很多同学无法想象的!此时唯一的一个有效的方法:凑字数!但是essay写作怎么凑字数呢?如何写够5000字essay?下面我 ...
- python+opencv+dlib瘦脸效果
对实现人脸瘦脸简单功能的一个记录,大概流程如下: 1.使用dlib检测出人脸关键点 2.使用Interactive Image Warping 局部平移算法实现瘦脸 参考:https://blog.c ...
- Node.js NPM 管理包
章节 Node.js NPM 介绍 Node.js NPM 作用 Node.js NPM 包(Package) Node.js NPM 管理包 Node.js NPM Package.json 根据安 ...
- Sklearn K均值聚类
## 版权所有,转帖注明出处 章节 SciKit-Learn 加载数据集 SciKit-Learn 数据集基本信息 SciKit-Learn 使用matplotlib可视化数据 SciKit-Lear ...
- spring boot 连接Mysql介绍
Spring Boot 集成教程 Spring Boot 介绍 Spring Boot 开发环境搭建(Eclipse) Spring Boot Hello World (restful接口)例子 sp ...