删除 HTML 中的背景图像：简单的分步教程，轻松实现干净的页面
有时候，您可能希望设置网页的背景或编辑元素，使其外观更具美感，或突出显示某些特定内容等。
但是，使用HTML并非人人都能轻松做到。因此，这里是您如何轻松在HTML中删除背景图像的指南！
如何在HTML中删除背景图像？
以下是您需要按照的步骤，以便在HTML中删除背景图像：
步骤1：使用一个<h2>元素和三个<div>元素创建一个HTML。对于第二个<div>，使用一个名称为“no-background”的“id”。
<h2>Example</h2>
<div></div>
<div id="no-background"></div>
<div></div>
步骤2：通过首先为初始和最后一个<div>元素添加样式，添加CSS。
添加您的<div>的高度和宽度，然后指定margin-bottom、border属性和background-color。
然后，使用background-image属性并设置“url”值。之后，将background-repeat设置为“no-repeat”，最后通过添加background-size完成。
这是它可能看起来的方式：
div {
height: 170px;
width: 300px;
margin-bottom: 20px;
background-color: #CDCDCD;
border: 2px solid #CDCDCD;
background-image: url('https://images.unsplash.com/photo-1507919909716-c8262e491cde?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60');
background-repeat: no-repeat;
background-size: 100%;
}
步骤3：最后，为具有名称为“no-background”的“id”的<div>添加样式，删除<div>元素的背景，并将background-image属性设置为“none”。
div#no-background {
background-image: none;
}
您的整个代码可能如下所示：
<!DOCTYPE html>
<html>
<head>
<title>The title of the document</title>
<style>
div {
height: 170px;
width: 300px;
margin-bottom: 20px;
background-color: #CDCDCD;
border: 2px solid #CDCDCD;
background-image: url('https://images.unsplash.com/photo-1507919909716-c8262e491cde?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=500&q=60');
background-repeat: no-repeat;
background-size: 100%;
}
div#no-background {
background-image: none;
}
</style>
</head>
<body>
<h2>Example</h2>
<div></div>
<div id="no-background"></div>
<div></div>
</body>
</html>
有了这些，您的图像的背景就成功删除了！
从PNG、JPG、JPEG和WebP图像中删除背景，使用Erase.bg：
Erase.bg是一款智能AI背景去除和编辑工具，可帮助精确编辑您的图像 使用Erase.bg，任何人都可以轻松删除图像的背景，而不论他们的技术技能如何。您可以使用Erase.bg删除PNG、JPG、JPEG和WebP图像的背景。
要从这些格式中删除背景，您需要通过网站访问Erase.bg，或者通过在App Store（适用于iOS用户）或Google Play Store（适用于Android用户）下载Erase.bg应用程序。
您可以使用Erase.bg轻松删除WebP、PNG、JPG和JPEG图像的背景：
步骤1：单击“上传图像”对话框，或者您也可以将图像拖放到页面上。
步骤2：屏幕上将显示一条消息，上面写着“正在上传图像，请稍候...”在此期间，Erase.bg的AI将通过其神奇之处从您选择的图像中去除背景。
步骤3：如果您想删除某些内容或编辑图像，您将在“去除背景”图像的右上角看到一个“编辑”选项。
步骤4：在不带背景的情况下将编辑后的图像下载到您的设备中。
FAQ
在这里，我们列出了社区中的一些常见问题。 如果您没有找到所需的信息，请随时通过 support@pixelbin.io 联系我们
为了在HTML中添加背景颜色，您需要执行以下操作：
附注：在此示例中，我们将更改表格的背景颜色。
步骤1：扫描HTML代码，了解您想要编辑的元素。如果是标题，请搜索<header>开标签；如果是<div>，请搜索<div>标签。
步骤2：现在，从众多可用的颜色中选择一种颜色。在这里，我们将选择#33475b。
步骤3：之后，在开标签中添加一个style属性。因此，您的HTML代码将如下所示：
<table style="background-color:#33475b">
<tr>
<th>Name</th>
<th>Job Title</th>
<th>Email address</th>
</tr>
<tr>
<td>Anna Fitzgerald</td>
<td>Staff Writer</td>
<td>example@company.com</td>
</tr>
<tr>
<td>John Smith</td>
<td>Marketing Manager</td>
<td>example2@company.com</td>
</tr>
<tr>
<td>Zendaya Grace</td>
<td>CEO</td>
<td>example2@company.com</td>
</tr>
</table>
为了在HTML中设置背景颜色，您需要使用style属性，该属性指定元素的内联样式。
style属性始终与HTML <body>标签一起使用，以及CSS属性background-color。这是因为HTML5不支持<body>标签的bgcolor属性。
因此，您的代码可能如下所示：
<!DOCTYPE html>
<html>
<head></head>
<bodystyle=“background-color:add_color”>
…
</body>
</html>
HTML中表示透明的代码是FFFFFF或00FFFFFF。
此外，您还可以使用关键字“transparent”来定义不需要不透明颜色的CSS属性。
rgba()和hsla()具有第四个参数（在0;1范围内），用于定义颜色的alpha通道。
不仅如此，十六进制还可以通过定义32位颜色而不是常见的24位颜色来具有第四个alpha参数。
最后，您还可以使用'opacity' CSS属性（在0;1范围内）来标记元素的透明级别。
背景图像的HTML标签是“background-image”。这是一个为HTML元素设置背景图像的CSS属性。
不，仅使用HTML无法删除图像的背景。您需要使用图像编辑工具或AI背景去除工具（如Erase.bg）来完成这个任务。
不，仅使用CSS无法删除图像的背景。但是，您可以使用CSS修改背景图像的外观，如调整其不透明度或添加滤镜效果。
为什么 Erase.bg
.webp){kind=icon}
您可以免费删除图像中任何物体、人类或动物的背景，并以任何格式下载它们。
.png){kind=icon}
使用Erase.bg，您可以通过拖放或点击“上传”来轻松去除图像的背景。
.png){kind=icon}
Erase.bg 可在多个平台上使用，包括 Windows、Mac、iOS 和 Android。
.png){kind=icon}
Erase.bg可以用于个人和专业用途。使用工具来制作你的拼贴画、网站项目、产品摄影等等。
.webp){kind=icon}
Erase.bg拥有一种人工智能技术，可以准确地处理您的图像，并自动选择要去除的背景。
.webp){kind=icon}
您不需要额外花费金钱或时间雇佣设计师、绿幕以及组织特殊拍摄来使您的图片变为透明。
