网页开发中遇到的小问题

来源:互联网 发布:淘宝破碎群岛飞行成就 编辑:程序博客网 时间:2024/06/10 12:12

经常写页面,总会遇到这样,那样的问题,每次遇到问题解决了,下次遇到又不知道该如何下手,所以项目结束了,对以前出现的问题做个总结:
1.当我开门开始写页面的时候一定要记得写<!DocType html>,原因如下:
如果不写文档申明浏览器会按照自己的渲染模式来渲染页面,就是所说的怪异模式,ie的盒模型。特别是再写前后端还没有分离的页面时,一定要注意,后端人员在改页面的时候,是不是忘记了你的文档声明,或者放错了地方,<!DocType html>一定是放在<html>上面(紧挨着)。




2.如果你用edge这个浏览器打开你的页面时,浏览器会把电话、邮箱、住址高亮显示,不管那你设置什么样式都改变不了,只要加上下面这段话就可以解决。


<meta name="format-detection" content="telephone=no,email=no,adress=no">


3.遇到 IE 浏览器,一定要加上下面这段话,让 IE 以最高版本的文档模式渲染页面,打个比方你的浏览器已经升级到了ie9,然而你的文档模式还是ie8。


<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">


4.用IE打开网站时,input框最后,总会有叉叉和小眼睛的图标,为了保证每个浏览器显示的效果一致,要去除IE中input框中叉叉和小眼睛的图标。
<style>        
::-ms-clear, ::-ms-reveal{display: none;}
</style>

5.谷歌中,当输入用户名和密码时,背景会变成黄色,去除的方法:
input{
    -webkit-box-shadow: 0 0 0 1000px white inset;
}

6.IE8中,input的设置高度时,IE8中的字体不局中,所以设置高度的时候一定要要设置行高,

与高度的值大小相等,例如:
style{
height:40px;
line-height:40px;
}

7.一个重要的问题就是input框的提示问题,之前找过好多种方法。
(1)第一种算是比较简单的,但是当input中value的值作为查询条件时,就不能使用了
<input type="text" value="我是默认值" onblur="if(this.value==''){ this.value='我是默认值}" 
onfocus="if(this.value=='我是默认值'){this.value=''}">
(2)第二种就是用插件解决了,兼容性比较好,使用起来很方便。
http://www.bootcdn.cn/jquery-placeholder/



8.写页面的时候,不知道大家有没有遇到这样的一个问题,就是用户用鼠标滚轮放大或缩小页面,有的时候会因为比例问题,影响页面的布局,所以我们要禁止用户用滚轮缩放,完美。

<script language="javascript">
         var scrollFunc=function(e){ 
          e=e || window.event; 
          if(e.wheelDelta && event.ctrlKey){//IE/Opera/Chrome 
           event.returnValue=false;
          }else if(e.detail){//Firefox 
           event.returnValue=false; 
          } 
         }  
         
         /*注册事件*/ 
         if(document.addEventListener){ 
         document.addEventListener('DOMMouseScroll',scrollFunc,false); 
         }//W3C 
         window.onmousewheel=document.onmousewheel=scrollFunc;//IE/Opera/Chrome/Safari 
      
    </script>

原创粉丝点击