7 9 月, 2014

IE8.0下DIVCSS网站不居中解决办法

一种在客户端解决

其实解决方法很简单。用IE8浏览器打开你的网站，如果发现错位问题，请不用惊慌。在菜单栏上，打开“工具”选项，在下拉菜单里找到“兼容性视图”，勾选上，你再看，是不是网站没再错位了。

二网站本身解决

IE8对margin:0 auto;这个CSS好像不再有用了，页面不能居中啦，下午回来再看看有什么办法居中，太平洋的前端也说他们公司无视IE8的存在，测试还是以前的版本。
原因找到啦，我把margin:0 auto;写在了body标签中，IE7以下都可以居中，IE8就不行，解决办法是，把这代码写在div大框架中就可以了。

百度搜索的资料：

程序代码

<style type="text/css"> 
body{text-align:center;width:100%;} 
#wrap{ 
text-align:left; 
width:560px; 
margin:0 auto; 
border:1px solid #333; 
background-color:#ccc; 
} 
</style> 
<div id="wrap"> 在所有浏览器中都有效的方法: <pre> 在所有浏览器中都有效的方法: 在所有浏览器中都有效的方法: 在所有浏览器中都有效的方法: 
</pre> 
</div>

2014年9月7日 by 风吹走了我技术相关

手机网站宽度自动适应手机屏幕

方法一：

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" />

在网页的<head>中增加以上这句话，可以让网页的宽度自动适应手机屏幕的宽度。

其中：

width=device-width ：表示宽度是设备屏幕的宽度

initial-scale=1.0：表示初始的缩放比例

minimum-scale=0.5：表示最小的缩放比例

maximum-scale=2.0：表示最大的缩放比例

user-scalable=yes：表示用户是否可以调整缩放比例

如果是想要一打开网页，则自动以原始比例显示，并且不允许用户修改的话，则是：

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />

方法二：

把这段

<!DOCTYPE ........>

替换为这段

<!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd">

注：此方法在iPhone下横屏时宽度会超过屏幕宽度出现滚动条，解决方法就是加上方法一的代码

2014年9月7日 by 风吹走了我技术相关

JS判断手机访问

现在手持设备越来越高级了，网页访问必须等跟上。一般为了适应手机的访问，大多数网站就设置一个简版或者是文字版用来提供手机访问。对于静态化的网站来说，要判断访问是客户端用的是什么系统还是有点麻烦的，下面这段代码可以帮你解决这问题。

<script>
var system ={
win : false,
mac : false,
xll : false
};

//检测平台
var p = navigator.platform;
system.win = p.indexOf("Win") == 0;
system.mac = p.indexOf("Mac") == 0;
system.x11 = (p == "X11") || (p.indexOf("Linux") == 0);
//跳转语句
if(system.win||system.mac||system.xll){
alert(system.mac)
}else{
window.location.href="手机访问地址";
}
</script>

2014年9月7日 by 风吹走了我技术相关