网页制作Webjx文章简介：本教程一共三个例子：1、设置背景颜色;2、设置文本的背景颜色;3、将图像设置为背景. 本教程一共三个例子：1、设置背景颜色;2、设置文本的背景颜色;3、将图像设置为背景。参考网页教学网关于CSS背景
在CSS（层叠样式表）中，背景是一个重要的概念，它可以包括颜色、图像以及它们的重复方式和定位。本教程通过三个具体的实例深入浅出地介绍了如何使用CSS来设置背景。
1、设置背景颜色
在网页设计中，背景颜色可以为整个页面或特定元素提供视觉效果。例如，我们可以为`body`元素设置背景颜色，让整个页面呈现出特定的色调。在HTML和CSS代码示例中，`body`元素的背景颜色被设置为黄色，通过`background-color: yellow;`实现。同时，`h1`元素的背景颜色设置为绿色，`h2`元素的背景颜色设为透明，而`p`元素的背景颜色则设置为一种RGB色彩值（250,0,255），对应于洋红色。另外，`p.no2`类的元素不仅设置了背景颜色为灰色，还增加了20像素的内边距。
```css
body {background-color: yellow;}
h1 {background-color: #00ff00;}
h2 {background-color: transparent;}
p {background-color: rgb(250,0,255);}
p.no2 {background-color: gray; padding: 20px;}
```
2、设置文本的背景颜色
有时候，我们可能希望只改变部分文本的背景颜色，而不是整个元素。这可以通过选择器和`background-color`属性实现。在示例中，创建了一个名为`highlight`的CSS类，将其应用于`span`元素，设置其背景颜色为黄色。这样，只要将此类应用到文本上，就能突出显示部分文本。
```css
span.highlight {background-color: yellow;}
```
3、将图像设置为背景
除了颜色，CSS还允许我们将图像作为背景。`background-image`属性用于指定背景图像的URL。在提供的代码片段中，整个`body`元素的背景被设置为`/i/eg_bg_04.gif`图像。这将使图像在页面的背景中显示，具体显示方式取决于其他如`background-repeat`、`background-position`和`background-size`等属性的设置。
```css
body {background-image: url(/i/eg_bg_04.gif);}
```
通过这些实例，我们可以了解到CSS背景设置的基本用法。颜色、图像以及其他属性如透明度、重复和定位等，都为我们提供了丰富的设计可能性，使得网页的视觉呈现更加丰富多彩。在实际应用中，可以根据需求组合使用这些属性，以达到理想的页面效果。对于初学者来说，理解并熟练掌握这些基本知识是构建美观且功能完善的网页设计的关键步骤。
