HTML背景

原创 2012年03月28日 11:07:34

好的背景能够让网站变得很美妙。
例如:
好的背景和文字颜色

<html>
	<body bgcolor="#d0d0d0">
		<p>
			This is a paragraph. This is a paragraph. This is a paragraph. This
			is a paragraph. This is a paragraph.
		</p>
		<p>
			This is another paragraph. This is another paragraph. This is another
			paragraph. This is another paragraph.
		</p>
	</body>
</html>

一个背景色和文字颜色让页面文本更易读的例子。
差的背景和文字颜色

<html>
	<body bgcolor="#ffffff" text="yellow">
		<p>
			This is a paragraph. This is a paragraph. This is a paragraph. This
			is a paragraph. This is a paragraph.
		</p>
		<p>
			This is another paragraph. This is another paragraph. This is another
			paragraph. This is another paragraph.
		</p>
	</body>
</html>

一个背景色和文字颜色让页面文本不便阅读的例子。
背景
<body>标签有两个属性可以指定背景。背景可以是颜色,也可以是图像。
bgcolor
bgcolor属性将背景设置为颜色,它的值可以是一个十六进制数、RGB值或者一种颜色名称。

<body bgcolor="#000000">
<body bgcolor="rgb(0,0,0)">
<body bgcolor="black"> 
上面三条语句都可以把页面背景设置成黑色。

background
background属性将背景设置为图像,它的值是你所要使用图像的URL地址。如果这个图像的大小不及浏览器窗口,它将平铺占满窗口。

<body background="clouds.gif">
<body background="http://www.w3schools.com/clouds.gif"> 
URL地址可以是相对地址(上面第一条语句),也可以是绝对地址(上面第二条语句)。

注意:如果打算使用背景图像,应该牢记:

n 这个图像会使页面加载时间过长吗?小技巧:图像文件的容量尽量不要超过10K。 

n 这个图像跟页面上其他图像协调吗? 

n 这个图像跟页面上的文字颜色协调吗? 

n 这个图像平铺了以后看起来还可以吗? 

n 这个图像吸引了文字的注意力,喧宾夺主了吗? 

技巧
<body>标签的bgcolor、background和text属性在最新的HTML标准(HTML4和XHTML)中已被废弃。W3C在他们的推荐中已删除这些属性。在HTML的未来版本中,层叠样式表(CSS)将被用来定义HTML元素的布局和显示属性。
一般的网站很少使用背景图像。
最常用的背景颜色是黑色、白色和灰色。

例如:
好的背景图像

<html>
	<body background="./images/background.jpg">
		<h3>
			Image Background
		</h3>
		<p>
			Both gif and jpg files can be used as HTML backgrounds.
		</p>
		<p>
			If the image is smaller than the page, the image will repeat itself.
		</p>
	</body>
</html>

一个背景图像和文字颜色让页面文本易于阅读的例子。
好的背景图像2

<html>
	<body background="./images/paper.gif">
		<h3>
			Image Background
		</h3>
		<p>
			Both gif and jpg files can be used as HTML backgrounds.
		</p>
		<p>
			If the image is smaller than the page, the image will repeat itself.
		</p>
	</body>
</html>

另一个背景图像和文字颜色让页面文本易于阅读的例子。
差的背景图像

<html>
	<body background="./images/rock.jpg">
		<h3>
			Image Background
		</h3>
		<p>
			Both gif and jpg files can be used as HTML backgrounds.
		</p>
		<p>
			If the image is smaller than the page, the image will repeat itself.
		</p>
	</body>
</html>

一个背景图像和文字颜色让页面文本不便阅读的例子。


HTML插入背景音乐

  • 2013年12月15日 10:11
  • 15KB
  • 下载

html表单,(内联)框架,背景,颜色

2016.4.5HTML基本学习完成

背景特效 html网页特效

  • 2011年12月08日 11:09
  • 18KB
  • 下载

HTML&CSS——css sprites技术将多个背景集成到一个png图片上css定位

美国YAHOO在页面制作中所用到的图片整合技术,这样做虽然需要花一定的时间来有规则的合并这些ICON,栏目背景,图片按钮,以方便CSS调用,但是这样做绝对是合算的,而且是有必要的,YSlow也是极力推...

Html+Css CSS中背景图片定位方法

CSS中背景图片的定位,困扰我很久了。今天总算搞懂了,一定要记下来。 在CSS中,背景图片的定位方法有3种:   1)关键字:background-position: top le...

js 特效 html 特效 背景音乐选择

  • 2011年06月13日 13:03
  • 7KB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:HTML背景
举报原因:
原因补充:

(最多只允许输入30个字)