页面总体布局思路

总体布局

先分析网页是由哪几个部分组成,再依次建立div元素。分清楚那些块分在一块儿是能够经过float来完成的。
分完块事后能够填充背景颜色来区分,这样方便布局定位,审查元素。

图片透明

img{
  opacity:0.4
}
opacity 属性可以设置的值从 0.0 到 1.0。值越小,越透明。

图像透明度 - Hover 效果布局

img{
  opacity:0.4;
}
img:hover{
  opacity:1.0;
}

图片遮盖技术,logo连接性能

h1{
        background:url("京东LOGO.png") no-repeat;     logo背景
        width: 168px;                                   宽度  
        height: 81px;                                   高度
        border: 1px solid red;                          边框
    }
    a{
        border: 1px solid #000000;                      边
        display: block;                 将行内元素转换为快元素,使之有宽高
        line-height: 81px;                         和logo同样高度
        text-indent: -1000px;                      缩进,直到看不见
    }
    <h1>
        <a>京东</a>
    </h1>

雪碧图url

div{
        width: 150px;
        height: 120px;
        background: url("sprites2.png");
        background-position: 0 -240px;
    }

        <div> </div>
相关文章
相关标签/搜索