如何创建一个单一的图像CSS3背景 - 傻瓜

创建CSS3背景最简单，最兼容的方法是使用单个图像。正确的图像说了很多关于您的网站，并提供页面之间的连续性。因为这种方法是标准的，所以你会看到它在很多网站上使用。所有你真正需要知道的使用它是background-image属性，如下面的过程所示。用你的文本编辑器创建一个新的HTML5文件。

1. <！ - 1 - >

   为HTML页面键入以下代码。

2. 单张图片背景

   可爱的猫
   
   以可爱的猫为背景的页面。
   将文件另存为SingleImage。 HTML。样品将出现在其他位置，因此命名非常重要。
   

3. 用你的文本编辑器创建一个新的CSS文件。

   键入以下CSS样式信息。

4. <！ - 2 - >

5. body {background-image：url（“CuteCat。jpg”）;背景颜色：SaddleBrown;颜色：SeaGreen; font-size：x-large; text-shadow：1px 1px Yellow;}

   这是单个背景图像的最简单形式。 background-image属性有一个与之相关的url（）函数。以防万一用户不能显示图像（或选择不），您需要设置适当的背景颜色。

   根据图像的不同（这个例子使用了一个特别难处理的文本），您可能需要设置文本的颜色和大小，以使内容易于阅读。

   这是一个使用文本 - 阴影属性的地方，可能会导致用户喜好和用户投诉之间的差异。为字体和阴影使用对比色，以便两者协同工作，使内容可以在具有一定范围的颜色的图像上查看。

   将文件另存为SingleImage。 CSS。样品将出现在其他位置，因此命名非常重要。

   加载SingleImage页面。

6. 你看到背景。请注意，图形从左上角开始，根据需要自动重复填充整个窗口。