html前端背景页面固定并且不重复

最新推荐文章于 2024-05-06 21:51:47 发布

成长的路y

最新推荐文章于 2024-05-06 21:51:47 发布

阅读量1.6k

点赞数 1

分类专栏：前端文章标签： html背景

本文链接：https://blog.youkuaiyun.com/qq_41508632/article/details/89385181

版权

前端专栏收录该内容

7 篇文章

订阅专栏

本文深入探讨了CSS中背景属性的使用方法，包括background-attachment、background-repeat和background-size等，解析了如何设置背景图片的固定、平铺和大小，为网页设计提供了实用的指导。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

<body class="gray-bg" background="${ctxPath}/static/img/wms.png" 
style="background-attachment: fixed;background-repeat: no-repeat;background-size: 100% 100%">

background-attachment:背景滚动模式
background-repeat：背景平铺

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

成长的路y

关注关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

html背景图固定,网页背景图片固定在一个位置不重复代码

weixin_30453651的博客

06-27

4661

css之background-repeat的几种属性background-repeat: 指背景图片的重复与否以及重复方式, 有no-repeat, repeat, repeat-x, repeat-y四种属性值.no-repeat: 即无论背景图片的大小, 只显示单个背景图片, 如首页的第一篇文章标题前的”NEW”图标, 代码如上所示;repeat: 指背景图片横向和纵向重复连续显示;rep...

JAVA前端HTML页面设计

weixin_68138130的博客

07-10

1547

JAVA前端HTML页面设计

参与评论您还未登录，请先登录后发表或查看评论

如何正确使用css将背景固定.html

04-17

如何正确使用css来将html的背景图片固定住不随着页面的翻页而变化，可以很简单的去将html的背景固定住使其不懂

CSS背景固定

weixin_43604435的博客

12-25

301

CSS背景固定 background-attachment属性设置背景图像是否固定或者随着页面的其余部分滚动; background-attachment属性可以使得页面产生视差滚动的效果; background-attachment：scroll | fixed.

固定页面背景

高压锅博客

08-30

296

body { background: #000 url(../images/test-bg.jpg) no-repeat 50% 0; margin: 10% 20%; color: #fff; font-family: 'helvetica Neue', sans-serif; background-attachment: fixed; text-

html中怎么设置背景图片固定,css如何实现固定的背景图像

weixin_30036893的博客

06-04

4618

所谓固定背景图像，就是当我们在页面输入任何内容时或者移动鼠标，背景图像都不会发生变动。css实现背景图像固定也是非常简单的，我们可以使用css中的background的相关属性来实现。推荐参考：《CSS教程》那么我们在前面的文章中有给大家介绍过CSS如何实现背景图像重复效果。下面我们就继续给大家介绍css背景图像固定的实现方法。代码如下：body {background-image: url("/...

WEB前端-背景属性

syh_SYH0321的博客

10-21

5666

img和背景图片的区别： img不需要专门写宽高就能够显示在页面上而背景图片默认是撑不开容器的需要专门写宽高一般产品插入图都推荐使用img 而一些小的icon 或者很少更新的图片再或者超大的图片推荐使用背景图而且背景图可以让内部的文字盖在上面，但是img不行（除非后期用定位）取值：no-repeat不平铺，repeat-x横向平铺，repeat-y纵向平铺，repeat横向纵向都平铺------默认。closest-side：指定径向渐变的半径长度为从圆心到离圆心最近的边。

前端速成教程（HTML、CSS、JS、Vue…）

最新发布

https://www.hyperplasma.top

05-06

3608

JavaWeb开发 SSM框架基础前端速成——HTML、CSS、JS、Vue、Ajax、前端工程化。Web技术教程：W3Schoo。Vue是一套前端框架，免除原生JavaScript中的DOM操作，简化书写。基于MVVM（Model-View-ViewModel）思想，实现数据的双向绑定，将编程的关注点放在数据上。Vue-cli是Vue官方提供的一个脚手架，用于快速生成Vue项目模板。

打造酷炫视差效果的固定背景图实现方法

在上述示例中，`.layer-fast`类表示该层背景图将随着页面滚动而快速移动，而没有设置`background-attachment`属性的`.layer`类表示背景图像固定不动。通过调整`.layer-fast`的滚动速度，可以模拟出视觉差效果。 ...

头歌教学实践平台 Web前端开发基础 CSS-背景样式

01-20

可选值包括`repeat`（水平和垂直重复）、`no-repeat`（不重复）、`repeat-x`（仅水平重复）和`repeat-y`（仅垂直重复）。 4. **背景位置**：`background-position`用来设置背景图像的位置。可以使用像素、百分比...

html背景图片不动内容根据滚动条滚动

12-04

背景图片不动内容根据滚动条滚动图片不动 html

html怎么加背景图片不重复,css怎么设置背景图片不重复？

weixin_31207903的博客

06-04

5155

在使用css添加背景图片时，默认的样式是图片重复；但有时页面只需要一个不重复的大背景图片，那么如何让背景图片不重复？下面本篇文章就来给大家介绍一下，希望对大家有所帮助。在CSS中，可以使用background-repeat属性来设置背景图片不重复。background-repeat属性用于设置背景图片的重复方式，将background-repeat属性值设为no-repeat即为背景图片不重复。b...

html+css实现滚动背景图固定

JackieDYH的博客

05-24

2021

实现页面滚动，背景图穿过的效果注意：内部图片地址，自己替换成自己的图片示例代码 css样式代码 * { margin: 0; padding: 0; } body, html { height: 100%; } body { font-size: 100%; font-family: Roboto, sans-serif; color: #4d4d4d; background-color: #fff; } .cd-main-c.

html中关于背景的设置

weixin_53892095的博客

07-16

1734

①将多个图片整合为一张图片，浏览器只需要发送一次请求，就可以同时加载多个图片，提高访问效率，提高用户体验。②将多个图片整合为一张图片，减少图片的总大小，提高请求的速度，增加了用户体验。取值：英文、rgba、rgb、#000000、hsl(a)精灵图又称雪碧图，是将小图标集中于一张图片上。

html点击按钮后，显示层，锁定背景

eddie_520的专栏

05-10

1732

注：本技术采用jquery，所以在用的时候记得引入jquery库 html代码按钮 js 代码 //获取说明数据 function operGroup(){ var format = " "+ "

html怎么给背景图固定位置,css实现固定背景图像的方法

weixin_34571972的博客

06-04

3771

css实现固定背景图像的方法发布时间：2020-08-29 11:26:59来源：亿速云阅读：81作者：小新小编给大家分享一下css实现固定背景图像的方法，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！所谓固定背景图像，就是当我们在页面输入任何内容时或者移动鼠标，背景图像都不会发生变动。css实现背景图像固定也是非常简单的...

html中怎么锁定浏览器页面,css怎么让元素固定不动？

weixin_39605278的博客

06-03

2037

css怎么让元素固定不动？下面本篇文章就来给大家介绍一下使用css让元素固定不动的方法。有一定的参考价值，有需要的朋友可以参考一下，希望对大家有所帮助。在css中，可以利用position属性，设置position:fixed来让元素固定不变。fixed 生成固定定位元素，元素脱离文档流，不占据文档流的位置，可以理解为漂浮在文档流的上方，相对于浏览器窗口进行定位。固定定位(position:fix...

html如何让背景固定不动了,css如何设置背景固定不动？

weixin_39882394的博客

06-16

1887

在前面的经验中，我们知道了怎么用css来设置背景图片，但是鼠标滚动滚轮时，背景图片会随同网页内容一起滚动，怎么才能让背景图片固定不动呢？背景图固定不动，不跟随滚动条滚动：背景附着属性 background-attachmentbody {background-image:url(../images/css_tutorials/background.jpg);background-repeat:no...

如何让背景图片固定不随滚动条滚动

qq_38857381的博客

05-08

9244

使用属性 background-attachment: fixed; 属性设置背景图像是否固定或者随着页面的其余部分滚动。三个参数： scroll 默认值。背景图像会随着页面其余部分的滚动而移动。 fixed 当页面的其余部分滚动时，背景图像不会移动。 inherit 规定应该从父元素继承 background-attachment 属性的设置。下面是样式...