css代码

 

背景与前景

background-color:#0000;                           //背景色,样式表优先级高

background-image:url(路径);                     //设置背景图片

background-attachment:fixed;                   //背景固定,不随字体滚动

background-attachment:scroll;                  //背景是随着字体滚动的

background-repeat:no-repeat ;                 //no-repeat   不平铺   repeat  平铺  repeat-x  横向平铺    repeat-y   纵向平铺

background-position:center;                     //背景图居中, 设置背景图位置的时候一定把repeat设为no-repeat

 

 

 重要部分

 

全部透明度

 

opacity:0.7;

 

 

 

过渡效果

 

transition:设置秒数;

 

 

 

圆角

 

border-radius:设置像素值;

 

 

 

阴影

box-shadow: 5px(向右) 5px(向下) 5px(虚化)加颜色;

text-shadow:sew(如上加像素值);文字阴影

 

转动角度

 

tramsform:skew(可以选择转动方式)(加转动的角度)

 

 

 

无序列表

<ul><li><li></ul>

顶部:top

底部:bottom

左:left

右:right

padding+方向可以只改一侧(input用的多一些)

margin(边距)

 

 

    鼠标移入触发

    a:hover{

          }

 

    访问时候样式

 

    a:link{

          }

 

 

 

     访问后样式

     a:visited{

          }

 

       被选择的链接样式

     a:active{

         }

 

 

 

JQuery代码

 

   鼠标移入事件触发

       mouseover()

 

 

    鼠标移出事件触发

        mouseout()

 

 

    鼠标点击事件触发

        click()

 

 

    鼠标双击事件触发

       dbclick()

 

 

    按下鼠标事件触发

  

    mousedown()

 

 

 

    松开鼠标事件触发

 

       mouseup()

 

 

 

    JQuyer代码实例

 

   微信 、微博、授权 、注册商标鼠标点击淡入淡出效果

  如果想换鼠标移入就有效果的话就把click（）换成mouseover（）

   每个都要有个按钮，比如<div></div> <input  type="button"  />...

   也可以不取值,不取值的话就在每个<div></div>中加入id,可以直接用"#"来取id名

   eq()为参数,注:(eq()是从零开始)

 

 weixin = $(".weixin")
    weibo = $(".weibo")
    shouquan = $(".shouquan")
    zhuce = $(".zhuce")
    baseb = $(".base-b")
    baseb.eq(3).ready(function() {
        baseb.eq(3).click(function() {
            zhuce.fadeToggle("slow")
        })
    })
    baseb.eq(4).ready(function() {
        baseb.eq(4).click(function() {
            shouquan.fadeToggle("slow")
        })
    })
    baseb.eq(5).ready(function() {
        baseb.eq(5).click(function() {
            weibo.fadeToggle("slow")
        })
    })
    baseb.eq(6).ready(function() {
        baseb.eq(6).click(function() {
            weixin.fadeToggle("slow")
        })
    })




     图片轮播代码
   首先要设置几张图片,我这里设置的是三张图片

    按钮设置的是轮播或者自己点击时背景颜色会变
   代码如下:

 

 toplogo = $(".top-logo");/ / toplogo 为图片,注:(前面的名字不要加"-",不要成top-logo)
    gap = $(".gap-b");/ / gap 为按钮
    ws = 1; / / 从第一张开始循环
    gap.eq(0).css("background-color", "#A52A2A")

    function move() {
        if(ws != 3) {
            toplogo.stop();
            toplogo.animate({
                    marginLeft: ws * (-1349) + "px"
                },
                500,
                function() {
                    ws++;
                })
        }
        if(ws == 3) {
            toplogo.stop();
            toplogo.animate({
                    marginLeft: 0 + "px"
                },
                500,
                function() {
                    ws = 1;
                    gap.css("background-color", "white")
                    gap.eq(0).css("background-color", "#A52A2A")