首页
学习
活动
专区
圈层
工具
发布
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    手机端页面自适应布局---rem

    rem布局,在页面中引入这都js代码。...否则,页面中html的font-size大小为:100*(当前页面宽度 / 640)。 1....为什么是640px 对于手机屏幕来说,640px的页面宽度是一个安全的最大宽度,保证了移动端页面两边不会留白。注意这里的px是css逻辑像素,与设备的物理像素是有区别的。...根据上面的js代码,如果页面宽度低于640px,那么页面中html的font-size也会按照(当前页面宽度/640)的比例变化。...大家可以看看淘宝的这个手机页面 淘宝手机站,基本就是这种感觉,底部导航和顶部搜索框用的高固定,宽自适应的方案,其余的部分基本都是随着浏览器宽度变化在等比例缩放。 最终页面代码首页代码大致如下 <!

    2.6K52

    解决DEDECMS织梦程序Tags标签页面伪静态展示

    /关键字/"这样展示的,他觉得不够友好,希望实现静态化或者伪静态。...于是搜索相关的文档然后加以修改页面,确实找到解决办法,但是这里遇到的问题一并整理出来,这是我来解决DEDECMS织梦程序实现TAGS伪静态的办法,我没有生成静态化的问题是这样几万数据可能会导致服务器挂掉...,还是用伪静态比较妥当。...第一、设置DEDECMS全站伪静态 这里我们到系统参数-核心中设置全站伪静态。同时,我们还需要给站点设置伪静态规则,这里他是用的Nginx,我们这里就用DEDECMS Nginx伪静态规则。...然后我们再去刷新整站,可以看到所有的TAGS变成伪静态页面"tags/关键字.html"这样的格式。

    6.4K20

    开启 Nginx 的 FastCGI Cache 缓存,加速 WordPress 伪静态页面

    Web 缓存是指一个 Web 资源(如 html 页面,图片,js,数据等)存在于 Web 服务器和客户端(浏览器)之间的副本。...其实在 Nginx 里使用 FastCGI 缓存得方法【张戈博客】很早就有分享,并且非常的详细,有兴趣的朋友可以参考【Nginx 开启 fastcgi_cache 缓存加速,支持 html 伪静态页面】...$request_uri"; fastcgi_cache_use_stale error timeout invalid_header http_500; #忽略一切 nocache 申明,避免不缓存伪静态等...$request_uri"; fastcgi_cache_use_stale error timeout invalid_header http_500; #忽略一切 nocache 申明,避免不缓存伪静态等...有关插件的详细使用请移步【Nginx 开启 fastcgi_cache 缓存加速,支持 html 伪静态页面】一文了解,明月就不再多做赘述了!

    3K32

    ​【DEDE伪静态】织梦DeDeCms手机站伪静态列表分页错误解决办法,生成列表翻页动态

    常用的参数标签汇总、以及操作过程中的一些bug问题解决方法,dede网站二开,以下龙腾飞网络科技-小吴在建站实操中笔记记录,织梦dede建站教程保存使用非常方便: 【DEDE建站教程】 织梦DeDeCms手机站伪静态列表分页错误解决办法...'-1.html'; 替换为如下的代码: /** * 文章栏目式伪静态 */ $articleDir = MfTypedir($typedir); $articleRule...articleUrl = '/'.preg_replace("/^\//", '', $articleRule); return $articleUrl; 接下来我们要在系统基本参数->核心设置里设置一下开启伪静态...,具体设置如下图: 在是否使用伪静态选项中,勾选是,就开启了伪静态功能了,添加文章时,按下图所示,勾选仅动态浏览,这样织梦系统才会是伪静态的。...经过以上的步骤之后,实现了织梦文章的栏目目录式伪静态显示,还需要让Web服务器对链接进行重写,这时候就该写伪静态规则了。

    4.1K00

    为网站开启Nginx缓存加速,支持html伪静态页面

    在我测试期间发现,Nginx 的缓存也同样可以缓存伪静态的 html 页面,完全可以替代 WP-Super-Cache 这类缓存插件了。...,可以缓存伪静态【这是亮点!】         ...二、本地模式 第一种代理模式,我们是利用本地转发变相实现反向代理下的 Nginx 缓存功能,并且可以缓存 html 伪静态页面。从整体的配置可以看出,已经非常接近百度云加速等 CDN 的缓存功能了!...测试中发现,这种模式貌似无法缓存 html 伪静态页面,稍有遗憾,有兴趣的童鞋可以深入研究看看,可能是我没测试到位。...而且,从代理模式的缓存中,我们甚至可以缓存 html 伪静态页面,这意味着什么?强迫症们有可以无情的丢弃一款 WordPress 缓存插件啦!

    5.3K90

    Nginx开启fastcgi_cache缓存加速,支持html伪静态页面

    不会的朋友可以参考前文: 为网站开启 Nginx 缓存加速,支持 html 伪静态页面 Ps:需要重新编译 Nginx,在原有的编译参数上新增一个 ngx_cache_purge 模块,比如: -...二、Nginx 配置 要用这个缓存功能,建议重新弄一个 server 模块(替换之前的),如下代码是张戈博客目前正在使用的规则(已删除了我自定义的伪静态规则,避免混淆视听): #############...######################################################## #     Nginx开启fastcgi_cache-purge缓存加速,支持html伪静态页面...host$request_uri"; fastcgi_cache_use_stale error timeout invalid_header http_500; #忽略一切nocache申明,避免不缓存伪静态等...(之前你新增的伪静态规则可以添加到这,没有就不用了)                 try_files $uri $uri/ /index.php?

    4.6K51

    Next.js静态页面渲染技术(静态生成和服务端渲染):BSRSSRSSG

    适合前后端交互不多的页面,如CMS(文章管理系统)生成静态页面、SSR(服务端渲染)是每次请求都生产新HTML(传统BS框架PHP、Python、Ruby、Java后台的基本功能)Sever Site...为什么不在后端渲染好,然后发给每个人这样就可以N 次渲染变成了 1 次渲染N 次客户端渲染变成了 1 次静态页面生成这个过程成为 动态内容静态化静态页面生成(SSG)前提:如果每个人都请求一个相同的资源...n次渲染变成了一次渲染,n次客户端渲染变成了1次静态页面生成。这个过程叫做动态内容静态化。如何做SSG:那么后端渲染还需要通过ajax来获取渲染内容么?...SSG静态化的优点:生产环境中直接给出完整页面首屏不会白屏搜索引擎能看到页面内容,方便SEOSSG静态化的缺点:所有用户看到的都是同一个页面,无法生成用户相关内容如果页面和用户相关呢?...的三种渲染方式(BSR、SSG、SSR) https://zhuanlan.zhihu.com/p/341229054转载本站文章《next.js静态页面渲染技术(静态生成和服务端渲染):BSR/SSG

    5.8K20

    单页面Vue网站无服务端实现静态化SEO

    ,在非SEO页跳转到SEO页之前,必须将该页面生成并发送到服务器 SEO页的生成: 搭建vue工程做出该页面 将js、css等静态文件先部署到服务器 使用模板软件或者自己写函数,实现渲染功能 将渲染软件部署到云函数或者本地服务器...非SEO页的管理页面增加按钮,发送文章内容到渲染服务器 将渲染之后的SEO页保存到静态文件托管文件服务器,发送方可以是渲染服务器,也可以是浏览器 推送链接到CDN服务商 检查链接是否可访问,推送链接到搜索引擎...还需要做的事 footer的站点名称与header保持一致;header动态获取和链接; SEO页的更新: 只要将更新后的页面保存到静态文件托管服务器即可 20190408 完成编码并上线 20190619...完成编码过程博文撰写Nginx配置 我们实现页面静态化之后,如果刷新会出现404,这时候需要修改Nginx的一些配置。...location @router { rewrite ^.*$ /index.html last; } } 这里的rewrite规则很重要,因为既要保证服务端在刷新时返回

    4.4K10

    移动端页面按手机屏幕分辨率自动缩放的js

    minimum-scale='+phoneScale+',maximum-scale ='+phoneScale +',user-scalable=no,">'); 18 } 19       做手机端页面最头疼的就是物理分辨率和逻辑分辨率的转换了...,在手机端的样式也会因此大乱,在页面头部加入以上一段js之后,在手机端就可以正常显示了, var phoneScale = phoneWidth/750; 除以的为设计图设计的页面宽度,750是按iphone6...来设计(根据自己使用需求来修改),即让页面的 放大比率=屏幕的逻辑分辨率/物理分辨率,从而达到适应手机的效果。...试想,浏览器如果把电脑端的980px的网页展现在宽度为750px的iphone6手机屏上,势必会放不下,手机端横向会出现滚动条,怎么阻止这种情况呢,很简单,浏览器默认一个虚拟窗口,不同浏览器有不同的虚拟窗口宽度的默认值如...; opera:850px; Andriod webkit:800px; IE:974px; 然后会把这个980px虚拟窗口装进宽度为750px的iphone6中,当然这样的话必须缩放,这就是为什么在手机中展现电脑端页面没有出现横向滚动条

    7.3K80

    根据访问请求客户端类型自动跳转到对应的页面地址,自动跳转到手机页面

    在智能移动终端横行霸道的今天,使用移动终端来访问网站的用户是越来越多,但针对PC用户开发的网站,在移动终端上的体验非常差,这不,我们开始针对移动终端也制作了体验相对更好的页面,那么我们怎么才能知道用户使用的是哪种终端来访问我们的网站呢...,总不能让用户再来记一遍我们的手机站域名吧,查阅资料,有很多方法可以实现这个需求,现在将发现的方法记录如下: JS实现方法: 方法一: function mobile_device_detect(url...+) { if(thisOS.match(os[i])) { window.location=url; } } //因为相当部分的手机系统不知道信息...= -1) { window.location=url; } //做这一部分是因为Android手机的内核也是Linux //但是navigator.platform显示信息不尽相同情况繁多...sUserAgent.match(/(ipod|iphone os|midp|ucweb|android|windows ce|windows mobile)/i))) { // PC跳转移动端

    4K20
    领券