新建pc端页面的模板
pc端页面,要做兼容。新建pc端模板时,先要初始化浏览器的样式,我命名为reset.css
@charset "utf-8"; /* 取消链接高亮 */
body,div,ul,li,ol,h1,h2,h3,h4,h5,h6,input,textarea,select,p,dl,dt,dd,a,img,button,form,table,th,tr,td,tbody,article,
aside, details,figcaption,figure,footer,header,hgroup, menu,nav,section{ -webkit-tap-highlight-color:rgba(0, 0, 0, 0); }
/* 设置HTML5元素为块 */
article, aside, details,figcaption,figure,footer,header,hgroup, menu,nav,section {display: block;}
/* 图片自适应 */
img {
max-width: 100%;
height: auto;
width:auto\9; /* ie8 */
-ms-interpolation-mode:bicubic;/*为了照顾ie图片缩放失真*/
}
/* 初始化 */
body,div,ul,li,ol,h1,h2,h3,h4,h5,h6,input,textarea,select,p,dl,dt,dd,a,img,button,form,table,th,tr,td,tbody,article,
aside, details,figcaption,figure,footer,header,hgroup, menu,nav,section{margin:0; padding:0; border:none;}
*{padding: 0;margin: 0;}
body{font-family: Microsoft YaHei,Tahoma,Arial,sans-serif; color:#525252; background-color:#fff;font-size: 18px;}
em,i{font-style:normal;}
strong{font-weight: normal;}
a{text-decoration:none; color:#676767; font-family: Microsoft YaHei,Tahoma,Arial,sans-serif;}
ul,ol{list-style:none;}
h1, h2, h3, h4, h5, h6{ font-size:100%; font-family: Microsoft YaHei,Tahoma,Arial,sans-serif;;}
img{ border:none; display:block;/*img底部空白*/}
textarea{ resize:none;}
input,area{ outline:none;border:0 none; font-family: Microsoft YaHei,Tahoma,Arial,sans-serif;}/* 谷歌浏览器表单元素外框 */
table{border-collapse: collapse;}/*table的重叠边框合并*/
然后新建html页面,这里须引入jquery,其版本建议越新越好 (ps:这里是最低兼容至ie9,若想兼容更低版本,可参考我其他随笔)
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8"/>
<title>检测IE浏览器版本是否过低</title>
<link rel="stylesheet" type="text/css" href="css/reset.css"/>
<script type="text/javascript" src="jquery-1.11.0.js"></script>
<script type="text/javascript">
/*判断浏览器版本是否过低*/
$(document).ready(function() {
var b_name = navigator.appName;
var b_version = navigator.appVersion;
var version = b_version.split(";");
var trim_version = version[1].replace(/[ ]/g, "");
if(b_name == "Microsoft Internet Explorer") {
/*如果是IE6或者IE7或者IE8*/
if(trim_version == "MSIE7.0" || trim_version == "MSIE6.0" || trim_version == "MSIE8.0") {
alert("IE浏览器版本过低,请到指定网站去下载相关版本");
//然后跳到需要连接的下载网站
//window.location.href="http://jiaoxueyun.com/download.jsp";
}
}
});
</script>
</head> <body>
</body> </html>
好了,基本就是这样了。
ps:欢迎拍砖
新建pc端页面的模板的更多相关文章
- pc端页面在移动端显示问题
1.pc端页面在移动端显示,默认视口宽度是980px(也就是body宽度是980px),可通过meta标签设置为需要的尺寸,比如页面中元素最大宽度是1220px,则如下所示 <meta name ...
- 移动端和PC端页面常用的弹出层
我们在页面的时候,很多时候用到了弹出层,消息提醒,确认框等等,统一样式的弹出框可以使页面更加优美.在此,我整理一下我们项目的移动端和PC端页面常用的弹出层. 一.移动端 我们需在页面引入弹出框的样式和 ...
- 让PC端页面在手机端显示缩小版的解决方法
做页面的时候我们做好pC端页面时,因编辑那边需求,在手机端页面也应该是缩小版,不能乱的.在网上找了各种解决方案,经实验,这种是可以的: 在head里边加上这两句meta <meta name= ...
- PC端页面同比例缩放
<meta name="viewport" content="width=1202"> //这行代码可以使PC端页面同比例缩放,不至于变形
- PC端页面转换成手机端页面的分辨率问题的理解
PC端页面转换成手机端页面的分辨率问题的理解 px vw rem 假如就以a4纸模式为设计图 ,在a3纸模式中设计,然后设计出来展示在不同的a4纸模式上 通常是 750px -> 100vw / ...
- pc端页面打包成安卓apk
一.phoneGap PhoneGap是一个采用HTML,CSS和JavaScript的技术,创建移动跨平台移动应用程序的快速开发平台.它使开发者能够在网页中调用IOS,Android,Palm,Sy ...
- PC端页面适应不同的分辨率的方法 (转载)
原文地址:https://blog.csdn.net/fengzhen8023/article/details/81281117 上周完成一个PC端的项目,对于我这样的小白来说,这个项目里面最大的问题 ...
- PC端页面如何调用QQ进行在线聊天?
pc端如何实现QQ在线咨询? html代码如下: <a href="tencent://message/?uin=1234567&Site=Sambow&Menu=ye ...
- 电脑分辨率与pc端页面布局
在电脑设置中选择:控制面板->外观和个性化->显示 可以设置页面的显示比例,原因是在1920*1080的分辨率下页面的图标就会变得比较小,方便用户看,这个功能就是把页面内容变大(默认是中等 ...
随机推荐
- MVC中的自定义标签分页控件,仅供大家学习!!
public static HtmlString ShowPageNavigate(this HtmlHelper htmlHelper, int currentPage, int pageSize, ...
- 自己写IRP,做文件操作,遇到的坑
在写文件的时候没问题,但是写完文件之后,就出问题了, 什么问题呢,是因为写完文件之后,文件关闭之后, 调用了一个叫做 CcFlushCache 的函数,这个函数是从CcWriteBehind 调过来的 ...
- python之合并多个字典或映射
问题 现在有多个字典或者映射,你想将它们从逻辑上合并为一个单一的映射后执行某些操作, 比如查找值或者检查某些键是否存在. 解决方案 假如你有如下两个字典: a = {'x': 1, 'z': 3} b ...
- JSP界面引用百度地图获取坐标
需求: 需要在JSP界面上引用百度地图,文本框中输入地址之后,自动拿到在百度地图上的经纬度 解决步骤: 1.引入百度地图api: head中进行引用<script type="text ...
- Angular 4 变更检测机制 ChangeDetectorRef 使用方法
1.在angular 2中,回调函数的返回结果,不会自动更新视图层的显示,可以用 ChangeDetectorRef 来驱动angular更新视图. import {ChangeDetectorRef ...
- zookeeper常用配置详解
#ZK中的一个时间单元.ZK中所有时间都是以这个时间单元为基础,进行整数倍配置的.例如,session的最小超时时间是2*tickTime tickTime=2000 #Follower在启动过程中, ...
- JavaScript常用技巧之数组操作
1.获取最后数组中最后一个元素 . arr.slice(-1).pop() . arr[arr.length - 1] 2.过滤重复元素 arr.filter(function(v, i) { ret ...
- MATLAB GUI 设计要点 转
https://www.cnblogs.com/wangh0802PositiveANDupward/p/4588512.html 从简单的例子说起吧. 创建Matlab GUI界面通常有两种方式: ...
- loj2472[九省联考2018]IIIDX
题意:要求构造一个d的排列使得满足d[i/k]<=d[u]且字典序最大. 标程(bzoj上并不能过): #include<bits/stdc++.h> #define mid ((l ...
- SSM框架整合依赖
<dependencies> <!--mybatis核心jar包--> <dependency> <groupId>org.mybatis</gr ...