zoukankan      html  css  js  c++  java
  • CSS 一些你不知道的知识以及hack知识

    我们在网页设计的时候,为了达到个性效果,需要将系统默认的鼠标形状改变掉,自宝义鼠标显示的形状,我们以前可以用javascript来实现。现在我们完全可以用css来实现这一个性效果了。

    CSS有一个属性:cursor,其作用是设置或检索在对象上移动的鼠标指针采用何种系统预定义的光标形状。

    以下是测试文本。

    <style type="text/css">
    <!--
    span {display:block;line-height:30px;margin:5px 0;background:#f0f0f0;text-align:center;}
    -->
    </style>

    <span style="cursor:pointer;">pointer 手型</span>
    <span style="cursor:crosshair;">crosshair 十字</span>
    <span style="cursor:text;">text 文本</span>
    <span style="cursor:wait;">wait 等待</span>
    <span style="cursor:help;">help 问号</span>
    <span style="cursor:e-resize;">e-resize 右的箭头</span>
    <span style="cursor:ne-resize;">ne-resize 右上的箭头</span>
    <span style="cursor:n-resize;">n-resize 上的箭头</span>
    <span style="cursor:nw-resize;">nw-resize 左上的箭头</span>
    <span style="cursor:w-resize;">w-resize 左的箭头</span>
    <span style="cursor:sw-resize;">sw-resize 左下的箭头</span>
    <span style="cursor:s-resize;">s-resize 下的箭头</span>
    <span style="cursor:se-resize;">se-resize 右下的箭头</span>
    <span style="cursor:move;">move 移动</span>

     

      由于不同的浏览器,比如IE6、IE7、IE8、Firefox等,对CSS的解析认识不一样,因此会导致生成的页面效果不一样,得不到我们所需要的页面效果。 
      这个时候我们就需要针对不同的浏览器去写不同的CSS,让它能够同时兼容不同的浏览  


    各浏览器CSS hack兼容表:

     

    IE6

    IE7

    IE8

    Firefox

    Chrome

    Safari

    !important

     

    Y

     

    Y

     

     

    _

    Y

     

     

     

     

     

    *

    Y

    Y

     

     

     

     

    *+

     

    Y

     

     

     

     

    9

    Y

    Y

    Y

     

     

     

     

     

    Y

     

     

     

    nth-of-type(1)

     

     

     

     

    Y

    Y

     

    其他说明: 
    1、如果你的页面对IE7兼容没有问题,又不想大量修改现有代码,同时又能在IE8中正常使用,微软声称,开发商仅需要在目前兼容IE7的网站上添加一行代码即可解决问题,此代码如下: 
    <meta http-equiv="x-ua-compatible" content="ie=7" /> 

  • 相关阅读:
    数据结构第2章 线性表
    电磁阀二位三通
    DSP芯片的基本结构和特征
    4. 输出文字
    NOP 指令作用[转]
    C语言内存分配calloc,malloc,realloc的区别
    多文件共享全局变量和函数[原创]
    练习1——四则运算
    作业3——阅读《构建之法》15章
    作业二——结对 四则运算
  • 原文地址:https://www.cnblogs.com/ming910806/p/3509409.html
Copyright © 2011-2022 走看看