您的位置：首页 > 百科管理 > 详情

h5素材背景图片-在html中，怎么设置背景图片不重复不平铺，只显示一张图片

原创：找图网 2023-06-30 11:09:39

html5怎么设置整页背景图片

html5中设置整页背景图片的方法是利用css3样式:

写法如下:

{

/* Set rules to fill background */

min-height: 100%;

min-width: 1024px;

/* Set up proportionate scaling */

width: 100%;

height: auto;

/* Set up positioning */

position: fixed;

top: 0;

left: 0;

}

@media screen and (max-width: 1024px) { /* Specific to this particular image */

{

left: 50%;

margin-left: -512px; /* 50% */

}

效果如:

html 如何让背景图片充满全图，就是拉伸

html语言

背景图片

拉伸代码:background-size:cover,可以使图片拉伸铺满背景。

拓展资料

背景 (background) 属性定义元素的背景效果

元素的背景区包括前景之下直到边框边界的所有空间。因此,内容框与内边距都是元素背景的一部分,且边框画在背景上。

CSS 允许应用纯色作为背景,也允许使用背景图像创建相当复杂的效果;CSS 在这方面的能力远远在 HTML 之上。

background 是用于在一个声明中设置所有背景属性的一个简写属性。

格式: background: {属性值}

继承性: NO

可能的值:

background-color

background-image

background-repeat

background-attachment

background-position

新增的值:

background-clip

background-origin

background-size

注:可以在此声明中声明1到5个背景属性。

这只是 CSS 1.0 的属性,在CSS 2.0 background已经退出了历史舞台。

例:

body

{

background: #ff0000 url('i/eg_bg_') no-repeat fixed center;

}

</style>

在html中，怎么设置背景图片不重复不平铺，只显示一张图片

背景图片不重复不平铺,可以这样设定背景:

1、<body style="background-image: url("图片文件地址"); background-attachment: fixed;">

这样背景图片就会固定住,不会因页面滚动而重复。

2、使图在任何大小的屏幕都不会显示重复,可以这样设定背景(图像不平铺):

3、两者结合,就是:<body style="background-image: url("图片文件地址"); background-repeat:no-repeat; background-attachment: fixed;">

扩展资料

超级文本标记语言文档制作不是很复杂,但功能强大,支持不同数据格式的文件镶入,这也是万维网(WWW)盛行的原因之一,其主要特点如下:

简易性:超级文本标记语言版本升级采用超集方式,从而更加灵活方便。

可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。

平台无关性:虽然个人计算机大行其道,但使用MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上,这也是万维网(WWW)盛行的另一个原因。

通用性:另外,HTML是网络的通用语言,一种简单、通用的全置标记语言。它允许网页制作人建立文本与图片相结合的复杂页面,这些页面可以被网上任何其他人浏览到,无论使用的是什么类型的电脑或浏览器。

参考资料

找图网 HTML