- 博客(2)
- 收藏
- 关注
原创 动画盒子布局问题,背景图片全窗口显示问题
全窗口显示: 将背景图充满整个html和body: 采用背景图的好处是充满窗口时不会像插入图片那样被压缩尺寸变形,采用 background-size: cover;使背景图自适应填充,并用定位属性将图片移动到窗口中心。这个问题相当于在一个盒子中将背景图居中填充问题。 * { margin: 0; padding: 0; } /* 背景图全屏显示 */ html,body{ ..
2022-05-12 21:58:38
346
原创 关于背景图与图片的区别整理,项目实操
img图片可看做行内块元素,它的尺寸可以撑开父盒子的高度,因此往往插入图片后再浏览器中能“立竿见影”。比较好的做法是给图片套上一层盒子,设置盒子的大小后将图片的宽高设置为100%,这样在盒子尺寸变化后图片的尺寸也能相应改变。 背景图更像是背景而非图片实体 ,因此它无法像图片那样撑开盒子的尺寸“自行显现”,因此必须给父盒子设置尺寸后才能看到背景图,并通过background-positon属性调整背景图的位置、background-size调整背景大小。这种做法在插入精灵图时应用较多。 图片开关项目举例,
2022-05-12 20:47:56
793
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人