会员中心 会员中心  付款方式 付款方式  代理加盟 联系我们  有问必答  全国免费热线:020-82162885
用户名: 密码: 验证码:     
 



六种不同网页背景制作技巧揭密(一)


http://www.okit88.com    发布日期:2011-10-27 9:52:18    浏览次数:2861     < 返回 >
<P>仅是一个照片,而是同一照片在水平和竖直方向上的反复排列。这就是浏览器处理图片背景时的规律方法,利用这一规律我们可以用一小块图片作为页面背景,让它自动在页面上重复排列,铺满整个页面,从而使网页的体积大大减小。 </P>
<P>  读者到现在恐怕都已经知道了沙纹背景的原理和实现方法,就是找一个小的图片,越小越好,但注意要使最后的背景看起来要像一个整体,而不是若干图片的堆砌。其实现的HTML语法如下: </P>
<P>  <body background="picture"> </P>
<P>  其中的"picture"表示背景图片的URL路径。 </P>
<P>  3.条状背景 </P>
<P>  条状背景与沙纹背景是比较相似的,它适用于页面背景在水平或竖直方向上看是重复排列的,而在另一方向上看则是没有规律的。它也是利用浏览器对图片背景的自动重复排列,与沙纹背景所不同的是它只让图片在一个方向上重复排列。 </P>
<P>  以在竖直方向上排列为例,首先用图像处理软件做一个从左到右为蓝白渐变的水平条状图片,其长度与页面的宽度相当。也通过 <BR>  <body background="picture"> </P>
<P>  将其设为页面背景,经浏览器显示后,就成为整个页面从左到右蓝白渐变的分栏颜色背景。当然,也可以用类似的方法实现条状背景在水平方向上的重复排列。 </P>
<P>  4.照片背景 </P>
<P>  把自己或朋友的照片作为页面的背景让大家看到,是有点令人激动的事情,但浏览器对图片的自动重复排列却使这一愿望难以实现。怎么办呢?只有想不到的,没有做不到的,这里我们用上一点简单的CSS。在网页文件的<head>……</head>之间加入下面的CSS语句: </P>
<P>  <style type="text/css"><!--body{background-image:url(myphoto.jpg);background-repeat:no-repeat;background-attachment:fixed;background-position:50% 50%}--></style> </P>
<P>  这样,在网页页面中,就可以看到你的照片位于页面的正中间,而且在拉动浏览器窗口的滚动条时,照片仍然位于页面的正中间而不随页面内容一起滚动。如果你觉得照片位于页面的正中间不满意,你也可以随意地调整它在页面中的位置,只需要调整"background-position"的值就可以了。 <BR></P>
 
www.vcitv.com
www.chineseap.com
www.bestzs.com
www.591114.com
www.pyvip.com