重生之我要深度学习web前端第四天

下载部分：

分析：

1  下载部分：(注意：细节微调)

偏移属性：( background-position:);

大部分运用了cs的偏移属性

先写一个大盒子：大盒子里有三个小盒子且登高等宽；

在cs部分运用偏移属性(background-position;)将每个图片进行偏移到每个对应的小盒子里；

侧边浮动部分：

没有移入鼠标之前：

移入鼠标之后：

2  侧边浮动部分：

运用到固定定位(position: fixed;)，相对定位(position: relative;)，绝对定位( position: absolute;)，以及无序列表(ul li)

在图片的选取中也是运用了cs的偏移属性

在侧边悬浮中有：hover属性当鼠标移入之后显示的效果

具体代码如下

  /* 宽 */

    width: 115px;

    /* 高 */

    height: 38px;

    /* 移入之后所替换的图片 */

    background: url(../img/r_all2022.png);

    /* 替换的照片的偏移量 */

    background-position: -121px -43px;

    /* 移入之后鼠标变小手 */

    cursor: pointer;

感谢各位大佬的欣赏