HTML - 背景( Backgrounds)
默认情况下，您的网页背景为白色。 你可能不喜欢它，但不用担心。 HTML为您提供了两种装饰网页背景的好方法。
- HTML背景颜色
- 带图像的HTML背景
现在让我们使用适当的例子逐一看到这两种方法。
与颜色的Html背景
bgcolor属性用于控制HTML元素的背景，特别是页面正文和表格背景。
Note - HTML5中不推荐使用bgcolor属性。 不要使用此属性。
以下是将bgcolor属性与任何HTML标记一起使用的语法。
<tagname bgcolor = "color_value"...>
此color_value可以采用以下任何格式给出 -
<!-- Format 1 - Use color name -->
<table bgcolor = "lime" >
<!-- Format 2 - Use hex value -->
<table bgcolor = "#f1f1f1" >
<!-- Format 3 - Use color value in RGB terms -->
<table bgcolor = "rgb(0,0,120)" >
例子 (Example)
以下是设置HTML标记背景的示例 -
<!DOCTYPE html>
<html>
<head>
<title>HTML Background Colors</title>
</head>
<body>
<!-- Format 1 - Use color name -->
<table bgcolor = "yellow" width = "100%">
<tr>
<td>
This background is yellow
</td>
</tr>
</table>
<!-- Format 2 - Use hex value -->
<table bgcolor = "#6666FF" width = "100%">
<tr>
<td>
This background is sky blue
</td>
</tr>
</table>
<!-- Format 3 - Use color value in RGB terms -->
<table bgcolor = "rgb(255,0,255)" width = "100%">
<tr>
<td>
This background is green
</td>
</tr>
</table>
</body>
</html>
这将产生以下结果 -
新页面打开带图像的Html背景
background属性还可用于控制HTML元素的背景，特别是页面正文和表格背景。 您可以指定图像以设置HTML页面或表格的背景。
Note - HTML5中不推荐使用background属性。 不要使用此属性。
以下是将background属性与任何HTML标记一起使用的语法。
Note - 不推荐使用background属性，建议使用样式表进行背景设置。
<tagname background = "Image URL"...>
最常用的图像格式是JPEG，GIF和PNG图像。
例子 (Example)
以下是设置表格背景图像的示例。
<!DOCTYPE html>
<html>
<head>
<title>HTML Background Images</title>
</head>
<body>
<!-- Set table background -->
<table background = "/images/html.gif" width = "100%" height = "100">
<tr><td>
This background is filled up with HTML image.
</td></tr>
</table>
</body>
</html>
这将产生以下结果 -
新页面打开图案和透明背景
您可能在各种网站上看到过许多图案或透明背景。 这可以通过在背景中使用图案化图像或透明图像来实现。
建议在创建图案或透明GIF或PNG图像时，尽可能使用最小尺寸，即使小到1x1，以避免缓慢加载。
例子 (Example)
以下是设置表格背景图案的示例 -
<!DOCTYPE html>
<html>
<head>
<title>HTML Background Images</title>
</head>
<body>
<!-- Set a table background using pattern -->
<table background = "/images/pattern1.gif" width = "100%" height = "100">
<tr>
<td>
This background is filled up with a pattern image.
</td>
</tr>
</table>
<!-- Another example on table background using pattern -->
<table background = "/images/pattern2.gif" width = "100%" height = "100">
<tr>
<td>
This background is filled up with a pattern image.
</td>
</tr>
</table>
</body>
</html>
这将产生以下结果 -
新页面打开
<上一篇.HTML - Blocks
HTML - Colors.下一篇>
