查看: 175|回复: 8

网页常用代码

[复制链接]
发表于 2005-1-3 13:59:36 | 显示全部楼层 |阅读模式
简单的window.open方法 , V; J1 Y+ W/ b3 s8 _+ A
  <a href="#" onclick="javascript:window.open(’文件路径/文件名’,
8 I( E1 R3 f% E; U# U7 P  ’listnote’,’toolbar=no,scrollbars=yes,resizable=no,top=0,left=0,
# n: Z5 j$ Y3 ~1 v% z+ N  width=350,height=300’);">文字或图片8 d1 E: l% f& E) f
   . T" f7 `, W4 b7 E
7 D! _) }' C5 ^2 M
图片随机替换
& O  j4 b2 u, X7 ]; m  
; F% c" ]) K& W  \/ f9 b  document.write(’’); [6 B) Z4 g# v7 V* U' C
   + K* ?% c; p/ h* N  L
  图片文件名为0.gif 1.gif 2.gif 3.gif 4.gif
7 E/ i  q9 o, l# `; ]; @6 P# j  x; |  s4 x3 F" i
设为首页
6 B: [& V* I0 Q, u  <a href="#" onclick="this.style.behavior=’url(#default#homepage)’;
5 K" \$ j' t$ o- ~* ]) k# d  kthis.sethomepage(’http://cu1985.126.com’)" height="2">
1 Y, u4 ~$ Z9 _) c. R* e$ g; y: P% g2 x, M. K
加入收藏 & f: v3 T0 w5 \
  <a href="javascript:window.external.
! l) X6 e9 [$ X: r0 C& [( A8 t9 Gaddfavorite(’http://www.wosay.net’, ’wosay中文网’)">
; m% S: H# z; c8 G6 V* }: }( ]: p% x! }, w) k0 v6 Q
忽视右键
  q! k% I+ g- K# G7 f: S  b  " k7 {  ~0 @& u
  或
& K( L: V8 Y6 [- a6 f7 |   8 O# I9 U; B' d& m& Y6 R4 c8 X

3 Z3 d5 \5 c% Q! m( \自动转页    $ r' Y8 k3 d! z) l) ^- z  u
  
- J( _" U8 A; Y3 A3 e" H3 Q& T$ W1 l2 h; H, k1 h# B; h( S6 M
加入背景音乐 $ B, m" {8 Z9 p" N! ~; w
  ie:# s# {! i* {# y; S, U
  ns:4 e' a8 I5 ~. S) T9 q  M! J; l
  - @* \  \( m+ s( |# |" K
  *.mid你的背景音乐的midi格式文件
3 Y  k3 e: t. @+ Z
9 z) [! w& T, A' Q, |' D0 F网页自动刷新  
' q( K. O  k/ |1 D  j  在head部记入
( v/ z! d0 Q# J, N9 e7 p; c7 M  - S! G9 @. @/ q' r7 }: r; I
  其中20为20秒后自动刷新,你可以更改为任意值。
! U2 Z' V0 f6 y- U6 Q5 _5 o. J% q5 t2 r+ _; E6 {4 q! ?
拉动页面时背景图不动    
- y6 i5 |" p) v. T6 p; u5 ]4 H( D  
# h3 n+ }. M9 E; b) c9 d  , V; q3 ?2 I# k" W$ U2 {
  body  {background-image:url(logo.gif);- p4 [% }" A* b1 z, l
    background-repeat:no-repeat; background-position:center }
9 N, ?6 O- q/ R% f  % b1 _* v0 l/ C0 I
  
. G& A3 x9 S1 c& q. e& P1 B. e# A( r
* o& w' @! G/ Y- T4 L1 ~让浏览器在保存页面时保存失败       
. m6 E! O$ i. R5 t4 X3 m3 k; o  . s9 z1 S$ s* O- N1 A' N: G3 F1 [
  
; t3 m' u/ j) L7 O  % @3 [  ?( |  ^$ Y* C
   ( z3 s- E6 G( |* J5 s3 l

# Y0 P' k0 q% n8 x" Y2 w4 q在网页中,图片和表格接触的地方如何不留空隙?       " I# Z7 l7 c0 S  L  q
  要使图片和表格接触的地方不留空隙,仅在表格属性面板上把外框线(border)设为0是不行的,不仅仅只是表格外框,还有两个设置,即在表格的属性面板上还要把单元格的两个属性设为0(cellspacing="0" cellpadding="0")。
2 ^* w# e, T6 n5 m. R' ~# y) l! K4 {) g: }% I
如何把自己放在主页上的zip或其他文件让浏览者下载(down)?
, R# a5 x+ Q' H7 [  用dreamweaver3其实很简单,把要让浏览者下载的文件名写上,然后拖动鼠标选取这段文字,在文本的属性面板上"link"的属性输入框中写上文件名就行了。注意:若被下载的文件与该网页不在同一目录下,则文件名必须包含相对路径,否则到下载时将提示找不到文件。 , ?) v2 G! ?- h% I1 X" t' Q

9 E9 j( h1 S5 f# W* }2 L点击连接打开本地"我的电脑"等
1 Q1 l: G  H) i! ]% |' U/ L  0 p  ~/ e0 x5 W( F9 c1 _
<a href="file:///::{20d04fe0-3aea-1069-a2d8-08002b30309d}" target="_blank">我的电脑
8 U; C8 i' ?  S, A' z  <a href="file:///::{208d2c60-3aea-1069-a2d7-08002b30309d}" target="_blank">网上邻居; ]! X5 ]2 a7 p8 m( C
  <a href="file:///::{645ff040-5081-101b-9f08-00aa002f954e}" target="_blank">回收站
- X% P% [' \/ Z& e$ K  <a href="file:///::{7007acc7-3202-11d1-aad2-00805fc1270e}" target="_blank">网络和拨号连接  |$ w4 X  ^) L6 z: o
  <a href="file:///::{d20ea4e1-3957-11d2-a40b-0c5020524153}" target="_blank">管理工具) a8 I- T* f# g! G- ^2 O
  <a href="file:///::{2227a280-3aea-1069-a2de-08002b30309d}" target="_blank">打印机
9 |& _5 P* Z  O3 y  <a href="file:///::{d6277990-4c6a-11cf-8d87-00aa0060f5bf}" target="_blank">计划任务
7 z; `: e' r, s  <a href="file:///::{d20ea4e1-3957-11d2-a40b-0c5020524152}" target="_blank">字体
5 }  U  K2 [# C7 @. O, p1 i1 E" x$ g8 I# t
简单的页面加密  + a; a' R; d( U" }
   <script language="javascript">
; f+ F9 r* h% ^! L     P* k. l. m6 p+ a4 M
    
& B! h/ D; N1 I+ }9 F" d& h( K6 N* m( \" H" m
网页自动关闭       
$ n4 ^8 C3 E0 G# ]4 v  
' c( M1 W! S! [5 x9 r   4 m8 j8 ]. J5 F3 o0 f3 j5 V8 A% |
  
/ p5 N+ X5 F* Q8 z3 w" Q& h7 Z( O   / f. U; e! b. a) l
  
; ]8 i, _1 R; y  
+ d; I8 a- R3 }# O   % R$ l2 h8 t" x. X6 Y. G# U+ Y
   这个窗口会在10秒过后自动关闭,而且不会出现提示.
! }) b! S2 T+ U9 h( @/ S    
1 {* k" }* A3 j2 [) {1 Q! ?7 g) J* X- j, Q/ B& e
保持layer在最前面,而不被iframe、object所覆盖   
; g3 e! K% X4 Y# r- R   在layer中再插iframe 或 object 设z-index值
" a2 J* ?# @9 b( ]8 K# 前面
4 z6 M. T) U- }# a. j/ t# 后面* F4 n  {. ^, t6 r6 c
height=100% width=100%>
: w$ R, S* m! X) h( n" k1 D5 ~0 R5 l+ Q" T

3 M# {4 `* H& ]! d, C9 Y' w! K2 P0 G0 u9 Y: G  h2 {9 S
3 P% c( e+ t9 U1 a. i7 H
8 C' Z( E0 i) ?; `0 S1 |) `
, A! d3 I5 `) `* g8 v- j
% t# y# v. V4 P; L, Z

2 }! O) f) G. K+ l+ }: P+ F4 C* ]. \$ [* _; x

& _6 s4 W' x% N( z
; }4 o: Y5 _# K9 L! T改变滚动条颜色     # ~: I1 c3 k- B/ ?# M
  
2 L7 r' j$ l% F* J+ C" v   body {
% G' F( z; o9 nscrollbar3dlightcolor: #ff0000; /*滚动条亮边的颜色 scrollbararrowcolor: #ff0000; /*上下按钮上三角箭头的颜色 scrollbarbasecolor: #ff0000; /*滚动条的基本颜色 scrollbardarkshadowcolor: #ff0000; /*滚动条强阴影的颜色 scrollbarfacecolor: #ff0000; /*滚动条凸出部分的颜色 scrollbarhighlightcolor: #ff0000; /*滚动条空白部分的颜色 scrollbarshadowcolor: #ff0000; /*立体滚动条阴影的颜色 scrollbartrackcolor: #ff0000 /*滚动条的背景颜色
& @( S  e' U6 ?* _  d   }
" \/ h3 S0 d' f( ~    
6 U* c9 u. n  F  Z7 E- E   说明:
/ b6 m1 r# F1 \) q  @: k1、必须是ie5.5+
2 G+ Z$ j7 I% w+ R2、当页面内容超出屏幕出现移动条时,设置的箭头颜色才有效 ! p5 e8 f; \* u( _5 J
3、母页的设置对iframe窗口的滚动条颜色无效,但是对textarea文本筐的滚动条有效# U; Y7 H2 d% u0 _, l8 D$ B3 c
7 n/ p8 B' C" y5 R8 Y
如何实现定义的超级链接文字颜色? 4 g. j$ x7 d4 z4 E# ~
  许多文章和教程都介绍过文字超级链接的颜色(包括未被访问的链接颜色、鼠标的链接上的颜色、已被访问过的链接颜色等等)可以用层叠样式表(css)定义,但真正在网页中要实现颜色按自己的意愿变化还确实不容易。下面把一些注意事项告诉你,你就能随心所欲地设置文字链接的颜色了。
+ R; [$ A; P" N- ]. I% c' g  1)超级链接的默认颜色是:未被访问的超级链接是蓝色、被访问过的超级链接是紫色;
0 O8 s) {0 X+ c  2)要想使css定义的颜色起作用,在超级链接的文本的颜色属性中什么都不要填;
$ b& m+ \. u' }8 t; k  3)若你已定义了文本的颜色,发现css中定义的超级链接颜色不起作用,你可以取消文本的颜色定义,或取消超级链接再重新定义一次,css定义的颜色就起作用了;
) T6 ?7 ~: |3 A$ Z$ y6 c( d  4)超级链接上各种状态下文本颜色的关系:一旦定义了被访问过的链接的颜色(a: visited),则当链接被访问过后,该链接的颜色不再改变,即定义鼠标在超级链接上的颜色(a: hover)将不起作用了。若不定义被访问过的链接的颜色(a: visited),则当鼠标在超级链接上显示a: hover 中定义的颜色,当鼠标移开时显示a 中定义的颜色。 3 ]4 W+ d/ c) e' G# t
   从上述可以看出,文本链接的颜色实际上只能在两种颜色之间变换,并没有象有些文章中讲的那样可以在多种颜色之间变换,但由于用那两种颜色可以任意,所以应该讲颜色的选择范围还是比较大的。 / C" b* }( p5 k4 [" c3 ~

/ [% B4 X  _1 s7 F, i8 H( C0 h有些网页的链接,原先没有下划线,你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。如何实现这种效果呢?
. q3 B- \" ]- N  可用层叠样式表(css)来实现的,在dreamweaver3中编辑层叠样式表不用编写代码,具体*作方法如下: : A% C3 J0 C2 s/ ~
  1)在快速启动栏中点击层叠样式表按钮(就是把鼠标放上去显示"show css styles"的那个按钮),在弹出的css styles面板上双击(none); , m' q) [1 w+ y
  2)此时,可看到弹出的edit style sheet 面板,在该面板上按new按钮; + m* g7 c5 X0 K& a
  3)再在弹出的new style 面板上点取redefine html tag(重新定义html标记)再在tag中选择"a"(超级链接标记)标记后按ok按钮;
+ X" w+ c8 V7 N" b, J) r* L  4)这时可看到弹出的style dehinition for a 的对话框,在此对话框中可以设置超级链接的许多属性,你可以按你的意愿设置,但我们这里主要是要去掉那讨厌的下划线,所以我们在decoration 属性中选择"none",这样就把下划线去掉了;然后我们再选择颜色为:#339966。按ok按钮返回到edit style sheet 面板;
) T, }% ~4 x! n( G  5)在edit style sheet 面板上再按new按钮; 8 P% c$ Q5 I3 N2 ~: X
  6)在弹出的new style 面板上点取use css selector ,再在该面板上的selector选择框中选择"a:hover"(定义当鼠标在超级链接上时链接的属性),按ok按钮;
% ~- t! s, b, n0 l" F! m" Y  7)在弹出的style dehinition for a:hover 的对话框中,我们在decoration 属性中选择"underline",这样就把下划线又加上了;然后我们再选择颜色为:#ff3300。按ok按钮返回到edit style sheet 面板; 8 V6 y- ^) M) S5 O0 {# T8 w
  8)在edit style sheet 面板上再按don按钮,至此所有设置结束,你在dreamweaver3的源代码检视窗中将看到在与之间如下所示的代码:; b; P2 v  f/ u1 j5 |' o& H
  & i/ p& B7 L! F0 }* j0 @8 d3 O
  
; T) D( s4 Q+ p   2 ]; X( p: q" M( m& r
  有了这段代码,你在该网页上的所有文字链接在浏览器中显示时没有下划线,当你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。若你想在其它网页中也具有这种效果,你可以用上述方法设置或更简单点,直接把这段代码复制,粘贴到与之间即可。注意:若不是在a 中定义除去下划线而是在a: link中定义除去下划线,在实际使用时不能除去下划线
 楼主| 发表于 2005-1-3 14:02:04 | 显示全部楼层
在网页中实现细线边框的两种方法; z/ Z! Z$ n- V; s" K
+ K) D/ A' j9 p4 Z) {  Y
很多朋友都有过制作网页的经历,如今,众多网页的设计都用到了表格。这样不仅有利于网页的维护,同时,提高了网页的观赏性。在众多网页制作风格中,细边框这个制作方法是必不可少的。这里,我将简单地谈一下细边框的制作方法。7 n' y  W3 }9 V4 T' g* |
0 g  d# N& R1 H7 u
  谈到细边框,本人认为大致有两种制作方法,第一种是用表格的嵌套,第二种是用CSS强制定义。
+ G' r5 `  A  X2 ^  I  
9 I3 h1 o& K) r8 m  如何用表格嵌套呢?大家都知道,用Bgcolor可以在表格中任意定义表格的背景颜色,用Cellspacing可以控制表格单元的额外空间,如果定义两个表格,把其中一个的表格背景设为全黑,然后在这个表格中嵌套定义另外一个表格,背景设为全白,并且把Weight=100%。这时,两个表格是重叠的,但是,如果把背景为黑色的那个表格再定义一个Cellspacing=1。那么就是说,黑色的表格比白色的表格多出了一个像素的外围空间,而白色的表格又在黑色表格之上,从而达到细边框的效果。源代码如下:
+ [, v# [* O& Q( y) n: u2 }% c' T9 N. ~8 m3 O, v6 U+ b/ H9 N
  〈table border="0" cellpadding=0 cellspacing=1 bgcolor=black〉
; p1 l" ~* ~/ P) z( _5 A, b. f9 l7 P) D% M. o6 m
   〈tr〉 ! V2 }7 \  w, g/ ]2 l1 w( W

% Y! X- b! W5 }   〈td〉
: o* ]6 @: e6 J% a. B/ S& e$ \7 q. [$ \  x+ ~! G5 t; f: o; |
   〈table width="100%" border="0" cellpadding=0 cellspacing=0 bgcolor=white〉
7 h1 G$ o! X- _9 n/ M8 n
6 {9 B0 F! \, d; W5 p   〈tr〉 5 i2 a: q' R5 J& {5 s

  q$ B  n7 u: H6 C5 d+ ]& d: Y   〈td〉
' D% w+ v) I% f& D; y/ h
1 J& Y+ W5 q1 `- k* O* }8 G5 x   〈/td〉' q8 Z5 F2 v0 }: e
+ G$ Z( P; j' d* ^% R- e
   〈/tr〉0 @1 f1 I' m/ ^- I1 F; `

6 k. p$ F+ i+ V5 y: X' |5 G   〈/table〉, j, w. T8 y) `' M- e4 Z7 b
1 z: S2 I, d9 p; |; j) N$ m
   〈/td〉
! V3 J3 K2 g: S
) r+ C6 [0 [1 y7 R   〈/tr〉% D- v8 ]% T5 ]+ t: _8 C

7 E( \0 z0 c# `0 R$ ~   〈/table〉* k: q+ }% X4 j( [* \

. }2 U0 @/ y; _- A" |  第二种比较简单,那就是用CSS(层叠样式表)强制定义,但是,有些比较老的浏览器不支持CSS,可能导致无法显示你所要求的效果。不过使用CSS定义,语句非常简洁,所作网页的容量也较小。它的*作方法是,在表格的最外围的相应最小单元的〈td〉标签中定义style="BORDER-postion: black 1px solid;",其中,Postion的参数有Left、Right、Top和Bottom,分别表示在单元的左、右、上、下显示一条1个像素宽的实线条。
, }, h, k7 H+ _4 m4 _# [- @- G
3 L5 H7 O: R2 f$ j9 r, I1 m5 Q; c- A5 ]  源代码如下:
5 x$ t) Z% |( M* P* E
4 a7 A) \/ q4 _: G# F. X  〈table border="0" bgcolor=white〉) _+ C! f  l4 e* @7 ^' P& |
2 Y/ |% i8 E+ k+ R5 _( g1 `( E, k
   〈tr〉
6 A% D# |" w6 U* m- _  I8 b3 f% |% V2 q3 n
   〈td style="BORDER-left: black 1px solid; BORDER-top: black 1px solid;"〉
; w3 |( i, Y4 w0 K9 E. G' F. C4 o, G& T7 M# O2 ~4 t/ p$ m6 U
   〈/td〉  i  K+ o. O2 ]7 y: X9 ^* w
' a0 B7 Q' |  {
   〈td style="BORDER-top: black 1px solid; BORDER-right: black 1px solid;"〉" X4 n2 e9 h( C' o0 G! M# k6 ^

! C$ Z1 t0 Y  ]  B& Y   〈/td〉
. S# e0 y2 I, l2 J1 j; U6 E+ ~. m+ `1 d* F- z2 @7 c, s+ k1 r
   〈/tr〉
# [* J/ j, n& O0 s0 \& ?; r) K' P& U3 x6 j2 w6 e
   〈tr〉   C' B* V: \+ S- {! K
; }; z; i$ v4 P( w6 t- a6 b. e+ u
   〈td style="BORDER-left: black 1px solid; BORDER-bottom: black 1px solid;"〉
0 D( ?9 |. T: P5 A# p
. ~4 v3 A' i2 d$ Q   〈/td〉
# e0 Q7 }9 h+ ~% Y; j
1 d: `0 w% u1 o; W6 i4 N3 f2 f4 x  W   〈td style="BORDER-bottom: black 1px solid; BORDER-right: black 1px solid;"〉& i& K% o0 _0 b2 }8 ?: N" b

2 [& A+ f7 t* W. _
; B( r3 x: {* c- d8 ^+ Z2 ~   〈/td〉
6 |6 N- p( R# ]3 I! N
9 X% d5 L  r0 I8 w# m   〈/tr〉
1 F+ {& l# s' f8 e8 R8 a' w% Y  N1 |4 Q. T# A- M4 w' I
  〈/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 14:13

Powered by iLang

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

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