手机端 默认字体

企业号有一种消息类型叫保密消息,该类型消息有全屏水印.图片水印.禁止分享至朋友圈.禁止选中文字等功能. 但是对于图片,手机端默认长按时会触发下载保存交互. 首先想到的方案是通过JS实现,对touch实践做处理. window.ontouchstart = function(e) { e.preventDefault(); }; 但是这个对于长的文章,滚动事件就失效了.所以此方案无效,但是如果只是某个div有需求,可以这样处理. 其实这个可以通过CSS3的属性去除. img { pointer-e

最近在做一个手机端页面时,遇到了一个奇怪的问题:字体的显示大小,与在CSS中指定的大小不一致.大家可以查看这个Demo(记得打开Chrome DevTools). 就如上图所示,你可以发现,原本指定的字体大小是24px,但是最终计算出来的却是53px,看到这诡异的结果,我心中暗骂一句:这什么鬼! 随后开始对问题各种排查:某个标签引起的?某个CSS引起的?又或者是某句JS代码引起的.通过一坨坨的删代码,发现貌似都不是.我不禁又骂,到底什么鬼!不过中间还是发现了一些端倪:当页面中的标签数量或者文本数

感谢浏览,欢迎交流=.= 公司开发微信网页多处需要使用弹窗,使用jquery-ui的定制化下载仍需要150多kb,想来有些奢侈(最终下来只有11kb,压缩后2kb,啊,我的神), 手机端弹窗方式与pc端有些不同,而且手机上有一个弹窗出来滚动跟父页面滚动相互影响的问题, 于是决定写一个插件,专门对付手机网页的弹窗. 弹窗的mask和dialog两部分都做成了position=fixed,比较喜欢这种效果,并且屏蔽了被遮住部分的滚动. 几处认为需要留意的知识点或困难点: 1.事件冒泡: e.prev

ThinkPHP3.2判断是否为手机端访问并跳转到另一个模块的方法 目录结构 公共模块Common,Home模块,Mobile模块 配置Application/Common/Conf/config.php文件 'MODULE_ALLOW_LIST' => 'Home,Mobile' 接下来配置Application/Common/Common/function.php文件 添加isMobile方法 [详见代码] function isMobile(){ // 如果有HTTP_X_WAP_PROF

一.        首先我们先来看看淘宝不同分辨率下的适配页面 可以看出来,淘宝在不同的分辨率下,页面的尺寸和模块间的间距会发生变化,这是因为淘宝采用了rem,这篇文章会简单介绍淘宝的布局思路以及具体做法,不过在此之前我们先了解一些移动端的知识,以为更好的理解淘宝布局的方案,下面我们来看一些移动端的知识 二.了解一些移动端的知识viewport的<meta>标签用法 其主要用来告诉浏览器如何规范的渲染Web页面,而你则需要告诉它视窗有多大 移动端开发中,通常我们都会采用<meta nam

手机端网页现在已经发展的非常迅猛,很多公司度需要网页能兼容各种不同尺寸屏幕的手机. 下面我给大家讲讲我常用的3放布局方式: 1:响应式布局. 可以用px作为像素,网页进行平铺.全屏的用100%.高度可以用px写死,宽度可以用百分比.不管网页怎么拉伸,高度不变,宽度会相应的扩大. 2:em/rem  方式布局. 可以设置好html,body的字体大小,然后用不同的尺寸手机访问的时候,我们可以去修改body的字体大小,网页(网页的内容用rem设置宽度.高度)的之内容会自动进行缩放. 代码如: bod

一.需求分析 项目中用到富文本编辑器的地方很多,富文本编辑器一般都是在pc后台上,因为前端是手机端,因此每次再富文本编辑内容保存以后,在手机端展示的样式和我们在富文本中编辑的不太一样,因此就需要在编写完内容之后可以模拟手机端进行预览一下,但是后端用富文本编辑器的地方比较多,不适合在每个页面进行开发,因此做成插件功能放入ueditor之中的方式改动的代价比较小. 首先看下效果 二.代码 先在ueditor.css中添加按钮样式图片: 路径:ueditor\themes\default\css\ue

Window.devicePixelRatioThis read-only property returns the ratio of the resolution in physical pixels to the resolution in CSS pixels for the current display device. 该值为分辨率之间的比,不是直接比较像素.分辨率是指单位英寸内像素数,类似于PPI.pc端浏览器中dpr的值都为1,所以css中1px的元素在屏幕中占据1物理像素.但在手

1,tap后会出现一个半透明的灰色背景.起初以为是outline作怪,加上后发现没反应.最后发现是tap后的背景高亮,要重设这个表现,则须要设置-webkit-tap-highlight-color为所需色彩.直接透明吧:a,img,button,input,textarea{-webkit-tap-highlight-color:rgba(255,255,255,0);} 2,另外,怎样去掉textarea,input的默认样式(IOS上的圆角及内阴影等,Android未測试):input,t