查看: 174|回复: 8

网页常用代码

[复制链接]
发表于 2005-1-3 13:59:36 | 显示全部楼层 |阅读模式
简单的window.open方法 % X  l: v5 `) ?7 T$ C. b
  <a href="#" onclick="javascript:window.open(’文件路径/文件名’,
& J- f1 p& j5 B+ n  ’listnote’,’toolbar=no,scrollbars=yes,resizable=no,top=0,left=0,
3 s  S4 b+ {' g, k, G5 y! C3 S  width=350,height=300’);">文字或图片
! S* r: \+ @; _# k* O# j: X  
* t; d9 u" G* F2 v1 o, S% T9 e* p! {/ o
图片随机替换
6 g7 O/ G# s3 a  " C* M% j" }: U& V' F
  document.write(’’)7 Z" D6 ^' J; b; L5 ~7 D
   6 d3 x1 U9 l2 U* p9 Y
  图片文件名为0.gif 1.gif 2.gif 3.gif 4.gif $ N) @, l2 C; G1 x' h# f

7 G9 v: f' p3 R; U; U1 n设为首页
, Y: A; y. u8 ~) m2 _# _8 G5 `  <a href="#" onclick="this.style.behavior=’url(#default#homepage)’;  u  D9 M" x5 h2 U- f3 I
this.sethomepage(’http://cu1985.126.com’)" height="2"> : m9 O9 k% S: r4 Z; w
# n( q& `* z1 P4 C0 S' m6 M' z& w) p
加入收藏 ; C( Y9 g+ v- R9 M! ~$ A& M
  <a href="javascript:window.external.
3 @$ B- C8 j- ^1 d# J# @- w7 K7 }( r& baddfavorite(’http://www.wosay.net’, ’wosay中文网’)">
" a( o% h: {% x9 P/ C% N) E  b. K8 M$ w
忽视右键
3 c  t0 q! S" ^9 y  . q9 t2 P& {5 K- i& _6 p. g& W( h, c
  或
. `8 j( p6 e3 x! x! ~& t; L  
" W( i4 ^) t9 X$ U2 c# Q! c4 Z- L1 e+ b8 s0 Y6 v" L
自动转页    $ P* O- u' F3 G$ b* d3 w$ o: ^
  
# t% ]# n! P1 q# l
; p9 A4 f# Q* L* s' _# |1 H9 c加入背景音乐
1 ]5 [' d3 q7 A. ]1 A/ a  ie:
; y+ E) K9 o; [/ r  ns:
7 B6 N; \9 Q' V  
' J  B0 z- ]; o* d$ D5 _0 Y  *.mid你的背景音乐的midi格式文件 * i2 A" b- Z4 x

6 }* k8 p! B; n( K网页自动刷新  
4 z& L" L7 Z. a. I8 g  在head部记入
- Y# m6 Q% P5 Z' u* ~  & S( d) i. |$ f9 h2 M2 \: U6 i
  其中20为20秒后自动刷新,你可以更改为任意值。
' ]4 a6 j2 J, s/ l% W
; X$ l' E* Q( w1 L9 C拉动页面时背景图不动    , d9 [8 X' i. v  s* l
  
7 E4 x# d! |0 p7 ]5 D    M2 d  V# d8 T$ w2 `& T
  body  {background-image:url(logo.gif);
- X3 F* V! C6 N* f! H  m8 i6 O3 G    background-repeat:no-repeat; background-position:center }( T" ]& ~/ r0 ^1 t7 D! y! [+ f
  
% G* ^# V: m5 y7 T   ) h) M6 }# d3 ~0 S. Y

: m! ?8 E- ?! V3 }让浏览器在保存页面时保存失败       
" s7 q% `+ S( e  ~. s+ }3 I  : [+ q, J9 _1 j) Z% }; y
  
9 B! i9 c$ ^9 z$ m" p  
0 M1 H% r  o/ h   - U0 e2 e2 F4 _1 b
7 z- u1 ?, r2 |
在网页中,图片和表格接触的地方如何不留空隙?       & B" X  Y5 _' U' M) M! F0 q
  要使图片和表格接触的地方不留空隙,仅在表格属性面板上把外框线(border)设为0是不行的,不仅仅只是表格外框,还有两个设置,即在表格的属性面板上还要把单元格的两个属性设为0(cellspacing="0" cellpadding="0")。
) ?. b) U0 M. t0 G8 Y. J: T1 Q3 d! _% o
如何把自己放在主页上的zip或其他文件让浏览者下载(down)?
) Q9 n7 v/ x& C; \0 y  用dreamweaver3其实很简单,把要让浏览者下载的文件名写上,然后拖动鼠标选取这段文字,在文本的属性面板上"link"的属性输入框中写上文件名就行了。注意:若被下载的文件与该网页不在同一目录下,则文件名必须包含相对路径,否则到下载时将提示找不到文件。 ' {5 W1 u! I; x2 g5 d
' i5 A& ~  v( |" |. R
点击连接打开本地"我的电脑"等 : L# Q9 M" T" t$ J; @
  
* S; F9 ]' U  o7 ?) V; B) o2 l9 D& D5 c<a href="file:///::{20d04fe0-3aea-1069-a2d8-08002b30309d}" target="_blank">我的电脑# f1 A2 w+ |2 l; w8 F
  <a href="file:///::{208d2c60-3aea-1069-a2d7-08002b30309d}" target="_blank">网上邻居9 J. x; c- ]% k" f/ S0 p$ q3 V8 ^# s
  <a href="file:///::{645ff040-5081-101b-9f08-00aa002f954e}" target="_blank">回收站
5 W) c+ C4 m: b/ l3 c  <a href="file:///::{7007acc7-3202-11d1-aad2-00805fc1270e}" target="_blank">网络和拨号连接
4 [: K" a9 ]5 C* o& y  <a href="file:///::{d20ea4e1-3957-11d2-a40b-0c5020524153}" target="_blank">管理工具* a0 N& x. m4 _; s2 p# I/ q9 c
  <a href="file:///::{2227a280-3aea-1069-a2de-08002b30309d}" target="_blank">打印机" H% n& U2 h* S( S3 z1 j& \
  <a href="file:///::{d6277990-4c6a-11cf-8d87-00aa0060f5bf}" target="_blank">计划任务
3 R% u$ j1 ~7 M3 E8 C  <a href="file:///::{d20ea4e1-3957-11d2-a40b-0c5020524152}" target="_blank">字体
' R, a2 y: l; U; f7 J  L& W0 v/ P2 e$ `  J: F( m$ b" k
简单的页面加密  
7 k7 ]( v/ K8 s/ F: D1 I" x% Q   <script language="javascript">* Z- ?( t9 _) Z- \5 v0 _7 {
  
: i6 {8 d1 v8 }1 O1 t    
$ T  s9 `) s3 Y& s- C: b' A0 z( `9 h8 R  k8 H% I
网页自动关闭       
) G- y9 H4 r; v% k; I' f: N5 B  
. E  T# R* A4 N& F6 A! d( v; F& {  
7 ^3 {3 E2 W0 ]9 P. |+ h1 i3 `  
' c1 u+ e3 _$ [  
. [: l8 p1 I1 |/ q# s7 G% O5 R& S   : V3 w4 {6 L1 i
   3 _" i9 ]" n, ^5 _. |$ o
  
' E0 ~- ^. Z1 _) j" D   这个窗口会在10秒过后自动关闭,而且不会出现提示.
/ j7 [/ @7 H0 j, C4 {7 d  ]    - v+ Q4 J4 i% }
  K" R% s3 ^8 H
保持layer在最前面,而不被iframe、object所覆盖   # p2 [' R( v% c& d! F) H7 m
   在layer中再插iframe 或 object 设z-index值
- d) z0 w, `' I! {- l( N# 前面
$ A* v" S+ T( ]" ~: D# 后面- W$ K" G/ Z0 [( ~5 o, |& }
height=100% width=100%>
' Y" P' W- r% T* b3 K, {' G6 ]7 S, u2 d! c
5 E6 T5 ?- o1 ]/ i  R* z" x
6 i  L# k0 J1 ?* }

/ x5 W# `7 C& ?1 r, \  U. H4 F; Q' f/ a; u( A6 u* x2 q, Q3 a

4 j  I  j7 x+ k9 m9 i
  d5 ]2 P- G* }/ Y# X0 h/ M1 a/ @7 d" ]0 |: t
3 s. h3 A# q$ x5 o' z) h  [/ m3 j# U
9 C& n! H3 L9 X% B: @

; P  K3 _, {; E( u' r$ l' @改变滚动条颜色     & f+ \% v: M" y/ T+ o! R! b; p3 e
   ( p2 E- r; E, H& H4 j
   body {
" O7 R$ @' A; I5 K, n' S  Jscrollbar3dlightcolor: #ff0000; /*滚动条亮边的颜色 scrollbararrowcolor: #ff0000; /*上下按钮上三角箭头的颜色 scrollbarbasecolor: #ff0000; /*滚动条的基本颜色 scrollbardarkshadowcolor: #ff0000; /*滚动条强阴影的颜色 scrollbarfacecolor: #ff0000; /*滚动条凸出部分的颜色 scrollbarhighlightcolor: #ff0000; /*滚动条空白部分的颜色 scrollbarshadowcolor: #ff0000; /*立体滚动条阴影的颜色 scrollbartrackcolor: #ff0000 /*滚动条的背景颜色
7 l7 ?- d7 ?' ?, U# k/ R   }
7 \" F1 Q/ l/ Q    
5 t  @! p1 _$ q/ Z1 ~- @   说明:
3 L3 a0 ^9 ?: D- t& K! |1、必须是ie5.5+( V9 n+ }7 L* \. g6 T3 w
2、当页面内容超出屏幕出现移动条时,设置的箭头颜色才有效 + {/ e2 m. G+ m* g1 @
3、母页的设置对iframe窗口的滚动条颜色无效,但是对textarea文本筐的滚动条有效4 F. s- b5 C' B" V" c

9 E* ^7 m* E$ F' k* C' c如何实现定义的超级链接文字颜色?
1 C! r. V8 M" K0 c7 Y  许多文章和教程都介绍过文字超级链接的颜色(包括未被访问的链接颜色、鼠标的链接上的颜色、已被访问过的链接颜色等等)可以用层叠样式表(css)定义,但真正在网页中要实现颜色按自己的意愿变化还确实不容易。下面把一些注意事项告诉你,你就能随心所欲地设置文字链接的颜色了。 ) o2 R# U, T4 ]% a( Y& P
  1)超级链接的默认颜色是:未被访问的超级链接是蓝色、被访问过的超级链接是紫色; . Y  k8 |: o$ t8 G
  2)要想使css定义的颜色起作用,在超级链接的文本的颜色属性中什么都不要填;
8 `; j8 X- d+ U5 U6 Z8 _1 b  3)若你已定义了文本的颜色,发现css中定义的超级链接颜色不起作用,你可以取消文本的颜色定义,或取消超级链接再重新定义一次,css定义的颜色就起作用了;
4 l2 K! @7 w, o5 n$ v! ~8 [  4)超级链接上各种状态下文本颜色的关系:一旦定义了被访问过的链接的颜色(a: visited),则当链接被访问过后,该链接的颜色不再改变,即定义鼠标在超级链接上的颜色(a: hover)将不起作用了。若不定义被访问过的链接的颜色(a: visited),则当鼠标在超级链接上显示a: hover 中定义的颜色,当鼠标移开时显示a 中定义的颜色。
. b. q! d- v) B* U3 V   从上述可以看出,文本链接的颜色实际上只能在两种颜色之间变换,并没有象有些文章中讲的那样可以在多种颜色之间变换,但由于用那两种颜色可以任意,所以应该讲颜色的选择范围还是比较大的。
6 u. j8 b! ?4 w$ k
: c% Q9 x  m- b. G3 @' e! _有些网页的链接,原先没有下划线,你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。如何实现这种效果呢?
6 K+ J& x3 t) j$ P7 ]$ M4 ?  n  可用层叠样式表(css)来实现的,在dreamweaver3中编辑层叠样式表不用编写代码,具体*作方法如下: 0 |8 O8 y  \; F0 H' p; _
  1)在快速启动栏中点击层叠样式表按钮(就是把鼠标放上去显示"show css styles"的那个按钮),在弹出的css styles面板上双击(none);
" u, Z8 N$ w, A2 y6 \* L/ X; ?  2)此时,可看到弹出的edit style sheet 面板,在该面板上按new按钮;
4 Z9 Z  j, c* ^& D+ a  3)再在弹出的new style 面板上点取redefine html tag(重新定义html标记)再在tag中选择"a"(超级链接标记)标记后按ok按钮; ) K" W& Y- C6 G" g& n$ y
  4)这时可看到弹出的style dehinition for a 的对话框,在此对话框中可以设置超级链接的许多属性,你可以按你的意愿设置,但我们这里主要是要去掉那讨厌的下划线,所以我们在decoration 属性中选择"none",这样就把下划线去掉了;然后我们再选择颜色为:#339966。按ok按钮返回到edit style sheet 面板;
/ S( R; f: x( @2 r9 \$ [4 U* n  5)在edit style sheet 面板上再按new按钮; ' H( q5 _1 z" ^) Q
  6)在弹出的new style 面板上点取use css selector ,再在该面板上的selector选择框中选择"a:hover"(定义当鼠标在超级链接上时链接的属性),按ok按钮;
$ O- l0 C& Q4 e" {/ e: Z9 j  7)在弹出的style dehinition for a:hover 的对话框中,我们在decoration 属性中选择"underline",这样就把下划线又加上了;然后我们再选择颜色为:#ff3300。按ok按钮返回到edit style sheet 面板;
1 Y6 i% z& t! c, |+ @" @  8)在edit style sheet 面板上再按don按钮,至此所有设置结束,你在dreamweaver3的源代码检视窗中将看到在与之间如下所示的代码:. p" p* g$ X2 _$ N: O" b! S
  
3 `1 D7 g9 S' _+ C  . X- Y! ?: T8 T" M. A( B
  
) G5 I) {+ h; K9 }0 r  有了这段代码,你在该网页上的所有文字链接在浏览器中显示时没有下划线,当你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。若你想在其它网页中也具有这种效果,你可以用上述方法设置或更简单点,直接把这段代码复制,粘贴到与之间即可。注意:若不是在a 中定义除去下划线而是在a: link中定义除去下划线,在实际使用时不能除去下划线
 楼主| 发表于 2005-1-3 14:02:04 | 显示全部楼层
在网页中实现细线边框的两种方法
( \" j- g# @# `& z9 k" P" B- y+ S+ Q5 F4 J
很多朋友都有过制作网页的经历,如今,众多网页的设计都用到了表格。这样不仅有利于网页的维护,同时,提高了网页的观赏性。在众多网页制作风格中,细边框这个制作方法是必不可少的。这里,我将简单地谈一下细边框的制作方法。% Y0 P% ^% ?1 z! u2 X3 R7 O
2 o1 C7 Z  \! {4 S( `
  谈到细边框,本人认为大致有两种制作方法,第一种是用表格的嵌套,第二种是用CSS强制定义。
& S" Y$ C. w+ ]5 a3 g% e2 Y* \   + p! ^5 M' O/ S# t5 D9 [" e
  如何用表格嵌套呢?大家都知道,用Bgcolor可以在表格中任意定义表格的背景颜色,用Cellspacing可以控制表格单元的额外空间,如果定义两个表格,把其中一个的表格背景设为全黑,然后在这个表格中嵌套定义另外一个表格,背景设为全白,并且把Weight=100%。这时,两个表格是重叠的,但是,如果把背景为黑色的那个表格再定义一个Cellspacing=1。那么就是说,黑色的表格比白色的表格多出了一个像素的外围空间,而白色的表格又在黑色表格之上,从而达到细边框的效果。源代码如下:8 o% ]  t: }, [5 V: r
6 i/ {) D6 `3 Q  B7 _0 c# ]6 _
  〈table border="0" cellpadding=0 cellspacing=1 bgcolor=black〉
6 [; O+ q3 C9 b+ f) `$ k
' f. e% k5 T  ]! N4 h   〈tr〉
: x* r7 }6 U2 Z& x4 d8 k( K# Q. l. y/ F# u0 K; m
   〈td〉 * ~3 ^, W% V5 K& ?1 H! A) w6 e0 ~

' h4 O. s/ N. q5 o9 O6 }   〈table width="100%" border="0" cellpadding=0 cellspacing=0 bgcolor=white〉* `, Y8 `2 H% m9 `
! U4 k; M  l0 H7 V; @. O' ^
   〈tr〉 ! v; q+ d- |3 `2 p. t
% [' i( `& z/ X" z! `/ |
   〈td〉& C9 J8 J8 T* T* V3 ?

3 t; b: X( E! q/ M/ v   〈/td〉8 }/ C3 F: \" j
+ m2 P+ D$ M# g+ B$ Q2 n
   〈/tr〉
+ a: a. S, L2 m1 p* p5 {
9 Y4 ?: u2 x* a- _$ ?/ U8 d" Q4 G   〈/table〉
* a2 q8 w- q& u% ~3 X. }& X& r/ V' L: S* {9 U) D2 v" E: O; L
   〈/td〉
! t, W' e+ I8 E, t+ e0 C* k( i
. z3 s* P- j( H/ Z& Q6 F   〈/tr〉. |9 F6 z' l9 A4 t

& n8 E- P# Q* G+ p) ]/ G# m9 Q+ c   〈/table〉& z5 `( D0 r3 W9 o
: z2 [& {$ Y; f7 w" Y5 O( d
  第二种比较简单,那就是用CSS(层叠样式表)强制定义,但是,有些比较老的浏览器不支持CSS,可能导致无法显示你所要求的效果。不过使用CSS定义,语句非常简洁,所作网页的容量也较小。它的*作方法是,在表格的最外围的相应最小单元的〈td〉标签中定义style="BORDER-postion: black 1px solid;",其中,Postion的参数有Left、Right、Top和Bottom,分别表示在单元的左、右、上、下显示一条1个像素宽的实线条。& W8 q* Q( n1 [% ^8 K9 ^# X

9 I5 w  W! ?& f; `; ]- `  源代码如下:5 @' Y0 o! O% R+ ^1 T+ J) F# r* w
+ y4 Q' p/ m6 u! F: R" A4 l
  〈table border="0" bgcolor=white〉# |" G; p% t& V
% ?- f2 z) w4 q* t
   〈tr〉 4 S6 W1 p1 Y' G: c

# F8 d/ m$ ~# J3 N) l$ q% X   〈td style="BORDER-left: black 1px solid; BORDER-top: black 1px solid;"〉
  q# n; L* Y. N7 p+ p
  X& ]! n( ?' e# O+ \   〈/td〉" O8 a0 E( h4 g3 K0 U

) I- z. ]" A, p& L) H   〈td style="BORDER-top: black 1px solid; BORDER-right: black 1px solid;"〉
) _$ W( h4 n( C3 r1 n
& L8 {. P- z$ i+ W5 p   〈/td〉
9 {) N( |- |% P( z; I3 h7 I, Y0 p1 g1 W; |# P
   〈/tr〉
6 @3 o# t. M; |) Y- U0 Q
, q. q- T# X7 |' |6 a- @( k   〈tr〉
7 N. L/ E: m& @$ B7 p
7 m: @3 j# \8 \( r' A. n   〈td style="BORDER-left: black 1px solid; BORDER-bottom: black 1px solid;"〉" b3 V' n% B* D+ P1 O+ s- |4 ]

9 \. I9 `1 b6 V3 S* c   〈/td〉
3 y/ O1 k1 A2 ?4 m& B1 w, m4 [( L! o
   〈td style="BORDER-bottom: black 1px solid; BORDER-right: black 1px solid;"〉
8 I4 V' v& Y' W; }
0 G' \7 f1 @3 S- p+ m" q2 {
  K6 y1 c1 \+ s% v) B: j   〈/td〉
0 Q- ?5 q0 l) f/ \5 M- w' z8 {
/ w: Z$ d) e; \9 l. D   〈/tr〉% C1 ~/ h4 D: x* y

& {) t. t5 j; t( B# o! k& H  〈/table〉
回复 给力 爆菊

使用道具 举报

发表于 2005-1-3 14:13:32 | 显示全部楼层
收了
回复 给力 爆菊

使用道具 举报

发表于 2005-1-3 15:37:36 | 显示全部楼层
这些很实用
回复 给力 爆菊

使用道具 举报

发表于 2005-1-3 19:49:38 | 显示全部楼层
不错,加分!
回复 给力 爆菊

使用道具 举报

发表于 2005-1-4 11:25:02 | 显示全部楼层
谢谢
回复 给力 爆菊

使用道具 举报

发表于 2005-1-4 16:19:11 | 显示全部楼层
有用的,我也收
回复 给力 爆菊

使用道具 举报

发表于 2005-1-4 16:21:48 | 显示全部楼层
真的不错,谢了
回复 给力 爆菊

使用道具 举报

发表于 2005-1-4 22:14:58 | 显示全部楼层
这个是基础,很实用.不错!
回复 给力 爆菊

使用道具 举报

您需要登录后才可以回帖 登录 | 免费注册

本版积分规则

联系我们|Archiver|手机版|小黑屋|TGL论坛

GMT+8, 2026-8-6 12:42

Powered by iLang

Powered by Discuz! X5.0  ·  © 2001-2026 Discuz! Team.

快速回复 返回顶部 返回列表