问题描述: 在一个很简单的测试页面中 简单的两块布局,上下两块均没有单独设置字体大小,都用body继承的大小,即40px.我们现在给第一个块.fl  加上浮动 float:left; 另外一个块处于正常文档流,不做任何操作.我们会发现,在chrome的手机调试模式下页面的渲染会发生怪异的行为,上下的字体大小居然不一样,而且还很明显. 想了很久完全没有什么头绪,不知道为什么会发生这种行为,于是我就借助chrome的调试发现,上面浮动块的字体大小是正常的40px, 但是下面正常文档流块元素中的字体大…

1.模拟单选点击的时候,在ios手机下,点击下面的内容选择,会出现页面闪一闪!! 解决方案:样式重置html的时候加上这句  -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 2.在ios中如果给input框设置行高(使文字垂直居中)会导致在ios手机上看的时候,ios自带的光标,会显的很大. 解决方案:把行高去掉!!可以改为设置其padding值或者使用flexbox-middle来实现水平垂直居中,但是只用padding来实现水平垂直居中的时候,如…

最近开发发现一个很有趣的问题  就是我如果给一个元素加上一个像素的 border 在不同的分辨率的情况下显示的不同 在高清屏幕(尤其是ios 喽 不鄙视国产) 据说在6plus下会变成3px  这个我就不知道了 因为我没有... 那么我们换个单位行不行? 因为移动端不用px来做 啊  对不起 你换了rem 或者em都不行(我只是测试了这两个单位) 废话不多说了  说一下解决方案 看一下我们老大 淘宝的解决方案 简单粗暴 更实用啊  这个图片我觉得够大了  对就是用了一个宽度为1px的div来模拟…

了解设备像素和css像素的因该知道,通常我们在写移动端时,是按照设计稿标注的像素除以设备的DPR来写真实的像素, 比如在iPhone6上,我们写的20px字体世界上在视觉效应上有20px; 所以当我们写1px边框时,在手机上看起来会变粗变为2px: 对此有如下解决方案: .border-1px(@color){ position:relative; &::after{ display: block; position: absolute; left:; bottom:; border-top:1…

用16进制编码的字体图标在部分小米机型显示不正常. 测试机型:小米1,小米1s,小米2浏览器:微信6.1内置浏览器,QQ浏览器 5.7 X5内核字体图标:不显示svg图标:显示正常 以下来自额微信内置浏览器的截图,字体图标不显示. 内置浏览器,uc浏览器,正常显示,以下为内置浏览器截图. 如 Glyphicons 官网的字体图标就显示不正常,svg图标显示正常. Glyphicons 官网:http://glyphicons.com/ 截图来自QQ浏览器(新版微信采用QQ浏览器内核)访问Glyp…

和以往一样,本次项目也放到了 Github 中,欢迎围观 star ~ 1. 前言 2. 基本概念 3. REM布局 4. VW布局 实现单边边框1px 实现多边边框1px 实现边框圆角 实现容器固定纵横比 5. REM + VW布局 6. 对比选择 方案选择 食用方式 一.前言 说到前端页面的布局方案,可以从远古时代的Table布局说起,然后来到 DIV+CSS布局,之后有了Float布局,Flex布局,Column布局,Grid布局等等. 而另一方面,还有一些 布局概念: 1. 静态布局 直…

一.总结 在Webx的Velocity中获取url中参数:$rundata.getRequest().getParameter('userId') 在Webx项目中,防止CSRF攻击(Cross-site request forgery,跨站请求伪造),在form表单提交中要加入$!csrfToken.ajaxUniqueToken 在MyBatis的mapper层,使用标签association实现对象的关联,一个bean配多个association标签. 二.Bug描述:Velocity从U…

最近花了半个月的时间,做了一个淘宝购物车页面的Demo.当然,为了能够更加深入的学习,不仅仅有PC端的固定宽度的布局,还实现了移动端在Media Query为768px以下(也就是实现了ipad,iphone 6 plus,iphone6,S5等)的Flexbox弹性布局. 还要再说的是,pc端和移动端淘宝购物车页面的Bug基本修复完毕,完全适合一个对HTML,CSS,CSS3,HTML5和Js有基础,并且熟悉jQuery,SCSS,熟悉JSON数据交换格式,jQuery Ajax的人进行学习.…

讲述背景,刚入职新公司2个月的时候,接手一个红包系统.资历尚浅,对业务也不是很熟悉.公司开发新的平台,需要使用红包功能来进行推广,按照产品的需求,进行开发...然而,问题就出在这里,红包接口比较陈旧,许多代码并有过多注释(甚至多出注释不全,注释出错),接口参数参差不齐,看的很累. 起先,将系统中所有调用红包的地方,都改成调用我的红包系统.和某端联调时,出现各种bug,参数无规约,返回参数不明确,(不知道要返回些啥,无明确需求文档),最后还是某端哥们,将原来的sql提供给我才得以解决此问题. 接着…

边界是众所周知的,有什么新的东西吗?好吧,我敢打赌,在这篇文章中,有很多你不看永远不知道的东西! 不仅可以用CSS3来创建圆角,使用原有CSS一样可以显示自定义图形.这是正确的(有待考究):在过去,没发现这种技术之前,我们可能使用背景图像定位来显示一个园或箭头.幸运的是,我们能放下PS图象处理软件了. 基础 你可能很熟悉边的最基本用法. 1 border: 1px solid black; 上面的代码将给元素应用1px的边.即简洁又简单:但我们也可以稍作修改. 1 2 3 border-widt…