专注Java教育14年 全国咨询/投诉热线:444-1124-454
赢咖4LOGO图
始于2009,口口相传的Java黄埔军校
首页 hot资讯 HTML背景图片示例

HTML背景图片示例

更新时间:2022-02-16 08:56:14 来源:赢咖4 浏览555次

HTML 元素上的背景图像

要在 HTML元素上添加背景图像,请使用 HTMLstyle属性和 CSSbackground-image属性:

在 HTML 元素上添加背景图像:

<p style="background-image: url('img_girl.jpg');">

您还可以在<style>元素中指定背景图像,在以下<head>部分:

在<style>元素中指定背景图片:

<style>
p {
  background-image: url('img_girl.jpg');
}
</style>

页面上的背景图像

如果希望整个页面都有背景图片,则必须在<body>元素上指定背景图片:

为整个页面添加背景图片:

<style>
body {
  background-image: url('img_girl.jpg');
}
</style>

背景重复

如果背景图像小于元素,图像将在水平和垂直方向上重复,直到到达元素的末尾:

<style>
body {
  background-image: url('example_img_girl.jpg');
}
</style>

为避免背景图像重复出现,请将background-repeat属性设置为no-repeat.

<style>
body {
  background-image: url('example_img_girl.jpg');
  background-repeat: no-repeat;
}
</style>

以上就是关于“HTML背景图片示例”的介绍,大家如果想了解更多相关知识,可以关注一下赢咖4的HTML教程,里面有更丰富的知识在等着大家去学习,希望对大家能够有所帮助。

提交申请后,顾问老师会电话与您沟通安排学习

免费课程推荐 >>
技术文档推荐 >>