页面背景图像的代码

1.(最普遍类)

<style>
body{background-image:url(logo.gif);
background-repeat:no-repeat;background-position:center}
</style>

说明:以上代码为网页背景图片固定代码!

网页背景图片固定代码。这样,当向下拉网页时,网页背景图片不会跟着向上移动。达到不动的目的!

2.(综合类)

3.<P class=style6> </P></SPAN><SPAN>
<TABLE width="100%">
<TBODY>
<TR>
<TD class=ArticleTitle align=left>
<DIV id=divTitle style="FONT-SIZE: 30px"><B></B> </DIV></TD></TR>
<TR>
<TD class=ArticleContent style="FONT-SIZE: 30px; LINE-HEIGHT: 150%" align=left>
<CENTER> </CENTER>
<STYLE type=text/css><!--body {background-image:url( 图片地址);

background-repeat:no-repeat;

background-attachment:fixed;background-position:50% 50%}</STYLE>
</TD></TR></TBODY></TABLE></SPAN>

说明:

no-repeat;(不平铺)

改为这个repeat(平铺)

你要以看一下两边

方法一:
文章编辑的时候点击创建表格后在弹出的窗体中把边框设置为0,然后填上背景图片的链接地址就好了

也能够用代码:
<TABLE height=600 width=600 background=你的背景图片地址 border=0>
<TBODY>
<TR>
<TD>你的主体内容</TD></TR></TBODY></TABLE>

方法二:
<body background=你的背景图片地址 >

方法三:
<STYLE type=text/css><!--body {background-image:url(你的背景图片地址);background-repeat:no-repeat;background-attachment:fixed;background-position:50% 50%}--> </STYLE>

方法四:

背景图是在HTML模式下把下面代码加到已有代码最前面:
<body background="图片地址">
注:图片地址必须是网络上已有的图片。不是本地机的,假设要链接本地机的,必先在相冊或者其它文章上传之后才干够调用。

方法五:
<STYLE TYPE="text/css">
<!--
BODY {background-image: URL(图片名称.gif);
background-position: center;
background-repeat: no-repeat;
background-attachment: fixed;}
-->
</STYLE>


◆字体属性:<font color=00dfff face="幼圆" size=4.5>显示文字</font>

◆背景,正文,连接颜色:<body bgcolor="#000000" text="#ff9933" link="#ff66ff">

◆ 给字体加光晕<table style="FILTER: glow(color=颜色)">文字</table>当中的glow客换成shadow,dropshadow等,产生的效果各不同样

◆颜色代码网址http://shirley329.blogchina.com/3501281.html

◆背景图案:<body background="http://图片地址" bgproperties="fixed">假设去掉后面的bgproperties="fixed"那么选折的背景会跟页面一起翻,这里给点儿建议,一般上下衔接的非常巧妙的或者用碎花,星星之类的作成滚动的比較好,而那种完整的图片最好就固定下?

当然自己最好都试一下,看哪个合适另外注意背景一定要选用颜色较浅的图画,要分得清主次,3楼有编辑的小工具,调一下GAMA值就能得到浅色的图片。还有个图片放大器。能够通过插值不失真的放大图片

◆背景音乐:<BGSOUND src="http://音乐地址" loop=infinite> 假设不加 loop=infinite 那么背景音乐仅仅播一边就结束了。假设想给自己的音乐加个精美的播放器,能够看这里。还能实现不同歌曲的连续播放里面有9种样式播放器

◆页面贴图:<img width=XXpx src="http://图片地址"> 即在涂鸦版里显示的图片,width事宽度还能够是height。也能够同一时候定义。注意数字与单位间不要有空格。也能用百分比表示。如以下

◆浮动的图片<div style="position:absolute;Top:0px;left:250px;"><img width=160% src="图片地址"></div> 这一条比上一个灵活非常多通过改动參数能够将图片定位在页面的不论什么位置 ,资源网址两边的引號是可有可无的单引也能够

◆贴图透明化:<IMG style="FILTER: alpha(opacity=100 Style=3 FinishOpacity=0)black();" src=贴图的网址 width=400 height=300> Style能够是1.2.3代表不同的效果、自己试试吧 opacity是透明度0~100 假设是0全然透明

◆超链接: <a href=http://www.地址.com target="_blank">被连接的文字</a> 被连接的文字能够更改属性。也能够换成喜欢的图片方法就是换成页面贴图target="_blank"指在新窗体打开,也能够删掉校内对&有限制,一般假设链接中有&就取它前面的地址。当然最好能先试一下

◆滚动的超链接: <marquee scrollAmount=2 width=300><a href=http://www.地址.com>被连接的文字</a></marquee>

◆改鼠标样式: <body style="cursor:url(’http://鼠标地址’)"> 4楼有270种鼠标

◆以下用CSS控制鼠标:<style type=text/css> <!--body{cursor:url(http://鼠标地址1)} a{cursor:url(鼠标地址2); --></style>

1是正常状态下,2是鼠标放在链接上时的效果

◆让页面以幻灯片切换效果显示: <head><meta HTTP-EQUIV="Page-Enter" CONTENT="revealtrans(duration=6.0, transition=23)"> <meta HTTP-EQUIV="Page-Exit" CONTENT="revealtrans(duration=6.0, transition=23)"></head> 这里enter和exit分别指在訪问或离开时背景图片出现和消失的方式 duration是时间。transition是方式共24种,0 盒状收缩 1 盒状放射 2 圆形收缩 3 圆形放射 4 由下往上 5 由上往下 6 从左至右 7 从右至左 8 垂直百叶窗 9 水平百叶窗 10 水平格状百叶窗 11垂直格状百叶窗 12 任意溶解 13从左右两端向中间展开 14从中间向左右两端展开 15从上下两端向中间展开 16从中间向上下两端展开 17 从右上角向左下角展开 18 从右下角向左上角展开 19 从左上角向右下角展开 20 从左下角向右上角展开 21 水平线状展开 22 垂直线状展开 23 随机产生一种过渡方式

◆滚动文字 :<marquee scrollAmount=2 width=300 height=160 direction=up>滚动的文字</marquee>

a)scrollAmount。它表示速度。值越大速度越快。假设没有它。默觉得6

b)width和height,表示滚动区域的大小,width是宽度,height是高度。特别是在做垂直滚动的时候,一定要设height的值

c)direction。表示滚动的方向,默觉得从右向左:←←←。可选的值有right、down、up。

滚动方向分别为:right表示→→ up表示↑,down表示↓。

d)scrollDelay,这也是用来控制速度的,默觉得90。值越大。速度越慢。通常scrollDelay是不须要设置的。

e)behavior。用它来控制属性,默觉得循环滚动,可选的值有alternate(交替滚动)、slide(幻灯片效果,指的是滚动一次,然后停止滚动)

f)怎样给滚动字幕加超链接?这跟平时的超链接是全然一样的。仅仅要在文字外面加上<a href=***>和</a>就能够了
g)改变滚动字幕的属性

颜色:<a style=color:CC6600>滚动的文字</a>
字体:<font color=00dfff face="幼圆" size=4.5>显示文字</font>
注意:滚动的内容还能够换成其它的东西。自己慢慢试吧

◆设置成滚动:<marquee direction=up marquee scrollamount=3 >当向上滚动height=0时,就隐藏了 

◆FLASH动画:<embed style="left: 0px; position: absolute; top: 50px; " align=right src=http://flash地址 width=1000 height=500 type=application/octet-stream ; quality="high" wmode="transparent">

希望各位能彻底搞懂这个,美丽的页面都少不了flash比方我的页面里的小时钟,发光的星星都是用它实现的,非常多贴子里提供特效只是是改动了里面的引用地址 left top是用来定位的当然也能够用right bottom width height来限制flash的大小align=right 表示右对齐

◆FLASH动画(相对定位即放在涂鸦板里):<embed style="left: 150px; position: relativity; top: 800px; " align=right src=http://flash地址 width=400 height=200 type=application/octet-stream ; quality="high" wmode="transparent">

◆假设要加时钟的话就用<embed style="left: 150px; position: absolute; top: 50px; " align=right src=http://时钟地址 width=1000 height=500 type=application/octet-stream ; quality="high" wmode="transparent">

width: hetght: 确定时钟大小。left: top: 来确定钟表在页面的任何位置。上面的代码是我页面时钟的位置

◆视频: <embed SRC=你的wmv的地址 type=audio/x-pn-realaudio-plugin CONSOLE=Clip1 CONTROLS=ImageWindow HEIGHT=252 WIDTH=324 AUTOSTART=true loop=true>

◆播放FLASH:<embed src=http://播放地址 quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="640" height="480"></embed>

◆ 更改页面文字样式(具体图解见5楼)
<style type=text/css> <!-- A:link{COLOR: #3366FF;FONT-SIZE:10pt;FONT-FAMILY: 宋体};A:visited{COLOR: #3366FF;FONT-SIZE:10pt;FONT-FAMILY:宋体};A:active{COLOR: #FF0000 ;FONT-SIZE:12pt;FONT-FAMILY: 宋体};A:hover{COLOR: #FFFFCC};body{COLOR:#3A5FCD;FONT-SIZE:10pt; FONT-WEIGHT:normal;FONT-FAMILY:宋体} --></style>

A:link是链接的部分
A:visited是已经链接过的链接部分
A:active是被激活的链接部分
A:hover是鼠标放上去时的显示
body是正文部分的更改。

FONT-SIZE 是字号大小的设置
FONT-FAMILY: 字体名称
FONT-WEIGHT: bolder 是加粗显示。能够替换的是normal,cite,等等默认的是normal使用这个能够让连接产生button形式动画效果

-----------------------------------------------------------------------------------------

加一些有用技巧

◆技巧1:非常多朋友都加了背景音乐,假设打开的页面多了就混在一块了,这是仅仅要按一下ESC键,音乐就停止了

◆技巧2:涂鸦板里加的代码多了,改动时就难了,加条凝视吧。格式例如以下: <!--凝视内容-->

◆在贴子里加链接:打开记事本输入<meta content="0; URL=’目标页面地址’"> 保存为.html形式,然后通过附件上传就能够了;content后面的參数表示几秒种自己主动跳转,这里当然设为0了假设在两头加上<html> </html>就能够把.html后缀删掉了

◆写给有一定网页基础的朋友:通过上面连接的样例不难想到,事实上我们全然打破校内网的种种限制自己设计网页,然后上传,仅仅要不大于1M就OK了,1M并不小,设计时全部用到的素材都单个传到校内上,然后作个首页组织起来即可了,就相当校内给我们提供了无限的空间,并且速度不慢,有兴趣的朋友能够试一下

◆查看别人涂鸦板里的代码,进入页面右击鼠标,选折查看原代码按CTRL+F输入"涂鸦板"查找就能够定位到涂鸦板的位置了,此法仅供学习之用,一定不要原盘COPY别人的成果

◆建立自己的专署留言板。到过我页面的朋友看到了吧,通过链接能够打开专门的页面留言。而原来的则隐藏了,制作例如以下:

1:用上面的群栏和留言类设置为滚动,参数了。零高度

2:建立链接。地址http://www.xiaonei.com/GetLeavewordList.do?

id=等号后面用自己的页码(进入他们的页面是最后的几个数字)

时间: 2024-10-01 04:51:12

页面背景图像的代码的相关文章

DEV winform treelist设置背景图像

treelist是一个复杂的控件,包括选中行,奇偶行等均可以单独设置显示效果,空白区域上背景图像的代码如下: private void treeList1_CustomDrawEmptyArea(object sender, DevExpress.XtraTreeList.CustomDrawEmptyAreaEventArgs e) { Image newImage = Image.FromFile("f:\\SampImag.png"); Point point = new Poi

jquery后台登录页面背景图片自动轮换登录界面代码

在别的网站上看到的比较炫酷的Web登陆界面,背景图片可以自动轮换.介绍给大家,有兴趣的可以下来改改当做自己系统的登陆界面. 如图: 点击下载源代码 jquery后台登录页面背景图片自动轮换登录界面代码

CSS 背景图像

background-image 属性可以设置背景图像. 背景图像可以填充整个页面的,也可以填写一部分. background-image 属性的使用很简单:background-image:url(图片地址) 填充整个页面示例 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>背景图片</title> 5 <style type="text/css"> 6 <!--背

CSS:背景颜色/背景图像

使用CSS可以为html标签指定背景图像或背景颜色,并且可以设置图像的位置. 代码整理自w3school:http://www.w3school.com.cn <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <meta http-

背景图像坐标定位

实际上,如果没有发明image标签,可能就没有网页设计师这门职业. 然而对image标签的滥用可能导致纯修饰性的图像把页面弄乱.好在CSS使我们能够在页面上显示图像,而不需要让图像成为标记的一部分.实现方法是将图像作为背景添加到现有的元素中.  背景图像基础: 默认情况下,浏览器垂直和水平的重复显示背景图像,让图像平铺整个页面. 渐变效果:目前渐变非常时髦,你可能希望在页面上应用垂直渐变,为此需要创建一个很高但是很窄的渐变图像,然后将这个图像应用于页面的主体,并让他水平平铺. 因为这个渐变图像的

给网页添加背景图像总结

1.固定宽度和可变宽度的圆角框 方法一:适用于新型浏览器,直接用border-radius属性 方法二:适用于旧版浏览器,IE6等 对于固定宽度圆角框,需要有两个图像,一个图像用于框的顶部,一个用于框的底部. 对于可变宽度圆角框,需用到滑动门技术(随着框尺寸的增加,大图像有更多的部分显露出来,这样就实现了框扩展的效果),这个方法需用到四个图像(top-left,top-right,bottom-left,bottom-right),bottom-left应用于主框div,bottom-right

Android Them+SharedPreferences 修改程序所有view字体颜色、大小和页面背景

有这么一个需求,可以对页面的样式进行选择,然后根据选择改变程序所有字体颜色和页面背景.同时下一次启动程序,当前设置依然有效. 根据需求,我们需要一种快速,方便,有效的方式来实现需求,然后可以通过Android Them + SharedPreferences 来实现需求.Them用于存放设置的每一种样式,并应用于程序中,SharedPreferences用于记住程序当前的样式,根据SharedPreferences的内容来设置程序的样式,实现下次启动能够oncreat当前的样式设置. 这里的Th

精通CSS+DIV网页样式与布局--页面背景

上篇博客,我们主要简单的总结了CSS的图片效果,我们这回来讲讲CSS如何对网页的背景进行设置,网页的背景是整个网页的重要组成部分,她直接决定了整个网页的风格和色调.这篇博客简单的总结一下如何用CSS来设置背景颜色.背景图片.首先,我们来看一张图: 接着,小编会随着上述思维导图的脉络,对各个知识点进行详细讲解,首先,我们来看页面背景色,例子代码和运行效果如下所示:   页面背景色 <span style="font-size:18px;"><span style=&qu

何时使用img标签,何时使用background-image背景图像

在什么情况下更适合使用HTML IMG标签来显示一个图像,而不是一个CSS有背景图像,反之亦然? 如下场景使用img标签比较合适: 1.如果图像是等内容的一部分或图表或人(真正的人,而不是股票图人),使用Img标签加上alt属性. 2.如果你想打印页面并且你想要的图像包括默认情况下使用IMG. 3.使用IMG(alt文本)图像有一个重要的语义时,比如一个警告图标.这将确保图像的意义可以很好的和user-agents沟通,包括屏幕阅读器. 4.如果你依赖于浏览器缩放图像比例并且可以呈现不错的效果时