Make cnblogs mobile Compatible
Introduction
博客园的许多页面都是只支持PC的,没有手机端的,也没有手机端的app。每次查看都有放大了才能看清楚字体,手指和游泳似的,左右开弓,很不方便。还有上次我修改了theme之后,手机端看是很好了,不过还是没有自动放大到合适的大小。所以申请了JS权限,custom CSS,小搞一下。
Steps
- 添加CSS
@media screen and (max-width: 450px) {
body{
width: 100% !important;
}
#home{
min-width:100% !important;
width:100% !important;
}
#header{
min-width:100% !important;
width:100% !important;
}
#blogTitle h1, #blogTitle h2{
width:100% !important;
}
#main{
min-width:100% !important;
width:100% !important;
}
.forFlow .day{
min-width:95% !important;
width:95% !important;
}
.postBody{
min-width:95% !important;
width:95% !important;
}
#topics .postTitle{
text-align:center;
}
#comment_form,
.commentbox_title{
min-width:95% !important;
width:95% !important;
}
div.commentform textarea.comment_textarea{
min-width:95% !important;
width:95% !important;
margin: 5px auto;
}
}
<head>添加viewport
<script type="text/javascript">
!(function(){
var viewPortTag=document.createElement('meta');
viewPortTag.id="viewport";
viewPortTag.name = "viewport";
viewPortTag.content = "width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0";
document.getElementsByTagName('head')[0].appendChild(viewPortTag);
})();
</script>
Results

Make cnblogs mobile Compatible的更多相关文章
- [转] Understanding Twitter Bootstrap 3
Bootstrap is a popular, open source framework. Complete with pre-built components it allows web desi ...
- 30款javascript脚本插件 jquery插件大全
Shifty Nav - a Fully Responsive JS CSS3 Mega Menu Show Demo Shifty Nav is a fully responsive CSS3 ...
- genmotion 安装 app 报错 This application is't compatible with your mobile phone解决办法
请下载这个文件:http://pan.baidu.com/s/1jIyMNbg(一个zip包) 将这个zip包拖放到genymotion的屏幕中,安装,然后重启就行了 我安装的Samsung Gala ...
- jQuery Mobile入门
转:http://www.cnblogs.com/linjiqin/archive/2011/07/17/2108896.html 简介:jQuery Mobile框架可以轻松的帮助我们实现非常好看的 ...
- 分享自制的13套 JQuery Mobile 界面主题(追加4套新款)
15套整合在一起的,其中2套官方+13套自制,款款精致,方便移动开发. 字体默认为微软雅黑. 适配于 JQuery Mobile 1.4.3 下载地址:http://files.cnblogs.com ...
- poj 1195:Mobile phones(二维树状数组,矩阵求和)
Mobile phones Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 14489 Accepted: 6735 De ...
- poj 1195:Mobile phones(二维线段树,矩阵求和)
Mobile phones Time Limit: 5000MS Memory Limit: 65536K Total Submissions: 14391 Accepted: 6685 De ...
- 经典收藏 50个jQuery Mobile开发技巧集萃
http://www.cnblogs.com/chu888chu888/archive/2011/11/10/2244181.html 1.Backbone移动实例 这是在Safari中运行的一款Ba ...
- (转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明
(原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll ...
随机推荐
- 第一个python程序
一个python程序的两种执行方式: 1.第一种方式是通过python解释器: cmd->python->进入python解释器->编写python代码->回车. 2.第二种方 ...
- insert操作卡死的处理过程
insert操作卡死的处理过程 先看看insert为什么被卡死 SQL> select sql_id from v$sql where sql_text like 'delete from st ...
- PHP处理一个5G文件,使用内存512M的,数据为整形,从大到小排序,优化排序算法
$file='./new.txt'; $fp = fopen($file, "r"); $chunk = 4096;//一次处理1M的字节 1M=1024*1024 $fs = f ...
- java线程同步 以及wait 和notify用法
package test; public class ThreadTest2 extends Thread { private int threadNo; private String lock; p ...
- How to reset password for unknow root
1. Click "e" when entering the grub 2. Add option " init=/bin/sh" to linux line. ...
- 一个快速double转int的方法(利用magic number)
代码: int i = *reinterpret_cast<int*>(&(d += 6755399441055744.0)); 知识点: 1.reinterpret_cast&l ...
- HTTPS 进阶
参考 一.中间人攻击 概念:攻击者插入到原本直接通信的双方,让双方以为还在直接跟对方通讯,但是实际上双方的通信对方已经变成中间人,信息已经被中间人获取或篡改. HTTPS 的攻击分为两类:SSL 连接 ...
- jqxComboBox
var uptype_source = [{ "TYPE_DESC": "总额度", " }, { "TYPE_DESC": &q ...
- 实现一个小目标,动动小指,分享可得iphone7/ipad/U盘|奥威软件
为什么很多人喜欢冬天呢?是因为冬天有着“床边挂起长长棉袜,而你做着甜甜美梦”的平安夜?还是因为冬天有着“具有无法言述的浪漫情怀”的圣诞节? 是不是还沉浸在平安夜,圣诞节的双节狂欢中, 好像不管长到多大 ...
- simple mail example for smtp debug
vim /etc/mail.rc head /etc/rc.local | mail -s "test_email" pyz_sub1@mailtest.com