查看: 222|回复: 8

网页常用代码

[复制链接]
发表于 2005-1-3 13:59:36 | 显示全部楼层 |阅读模式
简单的window.open方法 " E+ [: `4 `3 v) ?1 o3 n- A, l
  <a href="#" onclick="javascript:window.open(’文件路径/文件名’,
8 ^4 O2 b- W5 X) `6 j. O1 g& b9 j  ’listnote’,’toolbar=no,scrollbars=yes,resizable=no,top=0,left=0,& E: k5 g8 c4 F2 `
  width=350,height=300’);">文字或图片
9 }& w  z# W$ y! i) ?   ! o& l! {+ ]8 c9 u' o0 M6 \# M6 ]/ }

: a- e2 _- J0 i图片随机替换 4 F. |( Y" R( k0 C
  
/ p! I0 e* ^. E8 }& o: @- D8 a  document.write(’’)
$ c' b, o4 \' w3 T  m- i  a! t  
4 O4 l) d! O  Y' T  g  `/ f  图片文件名为0.gif 1.gif 2.gif 3.gif 4.gif
9 ]: S5 K7 \9 \' T( @3 E) {  p
3 }% R! f2 V6 J4 [; o+ L* N9 m设为首页 ; I/ F. r% a% i% b7 K( L
  <a href="#" onclick="this.style.behavior=’url(#default#homepage)’;$ I1 U# W) C0 G+ U
this.sethomepage(’http://cu1985.126.com’)" height="2">
  i& K" N4 m  o; r
5 T2 ?/ V/ `/ |( V$ a加入收藏 . V- H6 i2 x! i0 r1 ~
  <a href="javascript:window.external.( {# X! b6 [5 Z. S7 T
addfavorite(’http://www.wosay.net’, ’wosay中文网’)"> 1 q2 x, m8 m: K4 L4 L
& w5 U. t2 u6 E( }) j( _
忽视右键
% ^8 F3 y: ~, i0 M  P3 U, T" Y  
) k8 L( H; Y: |  或
9 n2 ?$ ~; B8 L  
& W; q5 c5 @+ R1 Z& J9 R  z% p
, B2 ?, z7 @7 E& s: F! [自动转页   
! J! g6 Q. h$ d3 c  
# p1 U. u6 ~1 o2 h
) U, V' [6 k1 o* A* d5 q7 i' F. c8 }加入背景音乐 ( {4 s3 k- ^( q- g
  ie:( b$ b% K6 [4 l# v9 |
  ns:2 p! G0 k" ~7 u4 \
  
. C4 \% k( O4 @" O8 z: Q, \  *.mid你的背景音乐的midi格式文件 & o- ?/ J% v9 U* p6 A

: z  {1 {( Z* s1 e  H- [8 q+ U  M: B, f网页自动刷新  6 h& N3 [. V7 M; E
  在head部记入
) ], Q7 W0 N9 H9 ~9 z/ E- V4 G  
  _: A4 [; w9 o9 t* U  其中20为20秒后自动刷新,你可以更改为任意值。 , e) V9 T' l( s7 w% Q- C# u. M

/ t% O9 H/ f0 F拉动页面时背景图不动      v, G1 M" g" I$ s+ e. W
  6 v9 W+ h4 t, {( s3 m# ^0 J6 Y
  ' |- y6 a) \: l4 u1 g
  body  {background-image:url(logo.gif);- y% P; M. i. F$ ]1 F
    background-repeat:no-repeat; background-position:center }
' u! [7 e# D9 O2 g% {  
1 r- I" J0 l' M& t; J$ K3 I" D( E  
# \  F! B6 D: {
* c4 E' \' J9 Q/ M- H- x1 X) q# _让浏览器在保存页面时保存失败       ( J! o3 l0 c4 `2 P# s' L1 k! P5 x
  9 U- B4 h$ e$ G9 N% h
  : C; t$ k; }8 d" F" g; P0 \
  
, t" ]3 D% d6 ~8 L; ^( M  
, r  e, w& a5 u: ~7 o. L' x
$ _- O$ M6 m+ N5 Y在网页中,图片和表格接触的地方如何不留空隙?         W& t6 H8 P, m* F' F
  要使图片和表格接触的地方不留空隙,仅在表格属性面板上把外框线(border)设为0是不行的,不仅仅只是表格外框,还有两个设置,即在表格的属性面板上还要把单元格的两个属性设为0(cellspacing="0" cellpadding="0")。 + Y! k' }* J  Y; x! R; ]0 w" r7 y) j

8 B3 A! X7 r& g/ u如何把自己放在主页上的zip或其他文件让浏览者下载(down)? 9 Q- f6 T/ w3 b$ X9 D
  用dreamweaver3其实很简单,把要让浏览者下载的文件名写上,然后拖动鼠标选取这段文字,在文本的属性面板上"link"的属性输入框中写上文件名就行了。注意:若被下载的文件与该网页不在同一目录下,则文件名必须包含相对路径,否则到下载时将提示找不到文件。 . Y$ l2 ^6 }; K
$ D; w+ i1 Z  s
点击连接打开本地"我的电脑"等 3 @1 F+ k$ d% A5 ]  o, K; L" n
  
5 s1 t: |' F& e, E! a3 |<a href="file:///::{20d04fe0-3aea-1069-a2d8-08002b30309d}" target="_blank">我的电脑
7 k6 u0 S- X/ g6 |  @  <a href="file:///::{208d2c60-3aea-1069-a2d7-08002b30309d}" target="_blank">网上邻居5 H/ w7 C' t+ L# ~9 S
  <a href="file:///::{645ff040-5081-101b-9f08-00aa002f954e}" target="_blank">回收站6 p$ {2 C9 {5 V
  <a href="file:///::{7007acc7-3202-11d1-aad2-00805fc1270e}" target="_blank">网络和拨号连接
0 Y' [" p! J1 ?" ?: g/ _  <a href="file:///::{d20ea4e1-3957-11d2-a40b-0c5020524153}" target="_blank">管理工具7 C. {) T) C2 _& T
  <a href="file:///::{2227a280-3aea-1069-a2de-08002b30309d}" target="_blank">打印机4 U5 a! H9 O5 j4 Q% K% s$ R
  <a href="file:///::{d6277990-4c6a-11cf-8d87-00aa0060f5bf}" target="_blank">计划任务8 f1 N1 J$ y- Z/ }# _, F
  <a href="file:///::{d20ea4e1-3957-11d2-a40b-0c5020524152}" target="_blank">字体# `; E0 l7 R$ R1 Q7 E

' E1 L% A% Z7 y5 \2 o简单的页面加密  8 j& e* K; l+ U& ]9 ?+ }7 ]: R# }1 s
   <script language="javascript">7 [, ~7 x0 Y' @, L
   - e" L! m4 ^5 R" d+ }3 \
    
( l* ^. t- }5 m& g' d% x/ J- B! _# D, C
网页自动关闭       ; ~2 r% M: N* Q' T
   0 _  Y9 n- Z: @7 r2 f0 ]
  
" E% j9 w. L! W; J  
& F! P( [( C0 x$ _0 h- V. D$ C3 k: ?  
) [2 B, O% f! \   - \" ^9 ~( q+ s6 i! a0 k7 f. u
   8 r4 h  n4 w( i* T6 X! j/ y; i
  
# w' {7 |. H( q3 F! P$ ^( `   这个窗口会在10秒过后自动关闭,而且不会出现提示.
/ E$ ]4 s) X; I9 n" ~' T! q    ; \  R  n2 |  z; j3 F5 k' D

+ p3 L3 C7 d0 T( B( v保持layer在最前面,而不被iframe、object所覆盖   
! L9 L  u# \0 T  G0 ?2 t' }9 f   在layer中再插iframe 或 object 设z-index值! X- t! ~3 \# Y- f% T# j: p6 m
# 前面2 M" u: T$ z! @/ O. A$ N
# 后面* O- l/ h# }, k7 c
height=100% width=100%>( d2 v% A: i% Z. h+ |% {

& d, n  {/ |: A
- j9 G( g' w( |2 X; n0 `& F
8 d3 a  R7 i" s/ \. x, s
/ R0 H3 Y' k9 h" R7 V2 \5 ~. B+ M
6 d7 m: Z: D5 J, r7 R. y- K' v3 D3 c4 v, R! V' [1 W! G

+ }3 F8 q4 Q5 p# T- v' ~
+ G3 I8 s  P1 u1 t7 @; t; F
( {+ k& {( v5 {) R6 D; `4 x( Y  f2 F: }* u) l
3 N% b# w9 b; \* e# s. t
改变滚动条颜色     
6 d, f' \+ p1 v+ `0 d& [; j  
9 Z& M3 E. w8 d   body {3 j( n. l9 h( I6 k( o
scrollbar3dlightcolor: #ff0000; /*滚动条亮边的颜色 scrollbararrowcolor: #ff0000; /*上下按钮上三角箭头的颜色 scrollbarbasecolor: #ff0000; /*滚动条的基本颜色 scrollbardarkshadowcolor: #ff0000; /*滚动条强阴影的颜色 scrollbarfacecolor: #ff0000; /*滚动条凸出部分的颜色 scrollbarhighlightcolor: #ff0000; /*滚动条空白部分的颜色 scrollbarshadowcolor: #ff0000; /*立体滚动条阴影的颜色 scrollbartrackcolor: #ff0000 /*滚动条的背景颜色( |2 `, O2 W; T' s- N3 B, F
   }
' e; a0 i# }7 u! _9 I  ~: |2 N5 K' {    3 |, k$ X. g8 P9 h% L) ]# [+ @9 m
   说明:
3 \/ ~: _( @. Q# c1、必须是ie5.5+
4 ?# y8 Q4 m1 e; r( g$ E5 M5 D2、当页面内容超出屏幕出现移动条时,设置的箭头颜色才有效
) v) x) Z7 n! w/ m2 B5 ?4 U! l3、母页的设置对iframe窗口的滚动条颜色无效,但是对textarea文本筐的滚动条有效
- J6 }5 K2 H8 E% P4 q; Z5 r6 S4 a3 k) {
如何实现定义的超级链接文字颜色? 1 b/ I8 X* Y. S/ D
  许多文章和教程都介绍过文字超级链接的颜色(包括未被访问的链接颜色、鼠标的链接上的颜色、已被访问过的链接颜色等等)可以用层叠样式表(css)定义,但真正在网页中要实现颜色按自己的意愿变化还确实不容易。下面把一些注意事项告诉你,你就能随心所欲地设置文字链接的颜色了。 . y$ e: `5 g8 S& B$ E6 J
  1)超级链接的默认颜色是:未被访问的超级链接是蓝色、被访问过的超级链接是紫色; 9 L) y0 D& a) ?) a8 }
  2)要想使css定义的颜色起作用,在超级链接的文本的颜色属性中什么都不要填; 3 t+ Q1 o) F- z; p3 ?
  3)若你已定义了文本的颜色,发现css中定义的超级链接颜色不起作用,你可以取消文本的颜色定义,或取消超级链接再重新定义一次,css定义的颜色就起作用了;
. |( \8 O9 \0 n# s/ E  4)超级链接上各种状态下文本颜色的关系:一旦定义了被访问过的链接的颜色(a: visited),则当链接被访问过后,该链接的颜色不再改变,即定义鼠标在超级链接上的颜色(a: hover)将不起作用了。若不定义被访问过的链接的颜色(a: visited),则当鼠标在超级链接上显示a: hover 中定义的颜色,当鼠标移开时显示a 中定义的颜色。
- ^0 Q; O; V) g  w* q) H. V1 L   从上述可以看出,文本链接的颜色实际上只能在两种颜色之间变换,并没有象有些文章中讲的那样可以在多种颜色之间变换,但由于用那两种颜色可以任意,所以应该讲颜色的选择范围还是比较大的。 , u9 ~9 B- O( k8 d7 u3 r0 v

- k" A1 b  u2 d2 ]  w+ {有些网页的链接,原先没有下划线,你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。如何实现这种效果呢? " f/ X( d9 B. w# M' m1 ?* d) @
  可用层叠样式表(css)来实现的,在dreamweaver3中编辑层叠样式表不用编写代码,具体*作方法如下: ; F8 \, [# F9 L4 V$ `: R& C
  1)在快速启动栏中点击层叠样式表按钮(就是把鼠标放上去显示"show css styles"的那个按钮),在弹出的css styles面板上双击(none);
( }% c7 C0 x7 M! B, V  2)此时,可看到弹出的edit style sheet 面板,在该面板上按new按钮;
% A/ Z: ^2 `* y% i; i& t0 L) S  3)再在弹出的new style 面板上点取redefine html tag(重新定义html标记)再在tag中选择"a"(超级链接标记)标记后按ok按钮; 4 y8 ^3 }2 }/ g3 w, w* ^. @: ]2 D
  4)这时可看到弹出的style dehinition for a 的对话框,在此对话框中可以设置超级链接的许多属性,你可以按你的意愿设置,但我们这里主要是要去掉那讨厌的下划线,所以我们在decoration 属性中选择"none",这样就把下划线去掉了;然后我们再选择颜色为:#339966。按ok按钮返回到edit style sheet 面板;
6 u3 ]5 o- k2 p/ o: i  5)在edit style sheet 面板上再按new按钮;
! [# B% X! X/ v9 X" k8 @  6)在弹出的new style 面板上点取use css selector ,再在该面板上的selector选择框中选择"a:hover"(定义当鼠标在超级链接上时链接的属性),按ok按钮; + [4 x! H3 p; e' i
  7)在弹出的style dehinition for a:hover 的对话框中,我们在decoration 属性中选择"underline",这样就把下划线又加上了;然后我们再选择颜色为:#ff3300。按ok按钮返回到edit style sheet 面板;
! X% T% ~! P6 `( ]$ j* ]  8)在edit style sheet 面板上再按don按钮,至此所有设置结束,你在dreamweaver3的源代码检视窗中将看到在与之间如下所示的代码:
8 Z- u" y( `& c4 b" c: U  
' j; `- _: @8 P* i# I2 W5 ]' a  ) N, s5 `0 p) e
     ~, e" ^+ ~5 K6 Y
  有了这段代码,你在该网页上的所有文字链接在浏览器中显示时没有下划线,当你把鼠标指向链接处,才会出现下划线,鼠标移掉下划线就又没有了。若你想在其它网页中也具有这种效果,你可以用上述方法设置或更简单点,直接把这段代码复制,粘贴到与之间即可。注意:若不是在a 中定义除去下划线而是在a: link中定义除去下划线,在实际使用时不能除去下划线
 楼主| 发表于 2005-1-3 14:02:04 | 显示全部楼层
在网页中实现细线边框的两种方法, K8 y+ h( \+ ]$ A

/ h! [0 q5 U: l! f$ I很多朋友都有过制作网页的经历,如今,众多网页的设计都用到了表格。这样不仅有利于网页的维护,同时,提高了网页的观赏性。在众多网页制作风格中,细边框这个制作方法是必不可少的。这里,我将简单地谈一下细边框的制作方法。) P2 Y1 u/ z- z% {+ F% q* h  u
& j5 w- S+ V2 g! [( S0 R
  谈到细边框,本人认为大致有两种制作方法,第一种是用表格的嵌套,第二种是用CSS强制定义。" u! u+ `0 `3 {1 n' M/ m8 m
   * D* Q9 _) P& e2 s
  如何用表格嵌套呢?大家都知道,用Bgcolor可以在表格中任意定义表格的背景颜色,用Cellspacing可以控制表格单元的额外空间,如果定义两个表格,把其中一个的表格背景设为全黑,然后在这个表格中嵌套定义另外一个表格,背景设为全白,并且把Weight=100%。这时,两个表格是重叠的,但是,如果把背景为黑色的那个表格再定义一个Cellspacing=1。那么就是说,黑色的表格比白色的表格多出了一个像素的外围空间,而白色的表格又在黑色表格之上,从而达到细边框的效果。源代码如下:
1 C( `% c! h% y. V1 e& l! }0 Y$ M: A0 a( m5 L* }& s4 X
  〈table border="0" cellpadding=0 cellspacing=1 bgcolor=black〉
2 V9 Z) I& \$ ]5 y3 g" n0 I9 E$ q) K( ?) j. k$ y
   〈tr〉
. r2 K0 q! k5 Y/ \0 F& {; q% P! o; _5 i9 y2 x0 N
   〈td〉 ' G" B1 O3 s- |" j

, Q8 ~# R: `# r. X, e" R   〈table width="100%" border="0" cellpadding=0 cellspacing=0 bgcolor=white〉
% U1 L8 P3 u7 _/ ?
6 ^- G. F+ D: v  y% V   〈tr〉 6 t6 g& x  n3 P& H- a- B1 ]

) i) U( C, \, ?6 H3 W% q. e, m   〈td〉* s# }# K! R1 k

7 m& }) T5 b6 K   〈/td〉
- ?& w0 H  ^: N. i) O% {) }6 d0 ?% _* E0 @9 e
   〈/tr〉
" x( G$ h3 M/ o9 k, D2 D6 y2 R1 \+ ^! @5 e$ i# W0 C
   〈/table〉
/ L5 o& ?( Q) \
5 ?1 U$ K3 s, B( E' j   〈/td〉
' w1 F6 J( P  D1 M: R7 q/ o
0 f1 e5 U9 W7 z4 \% j1 L6 T1 t   〈/tr〉
! R3 ]; E) w, e# r( x  U" j
6 E% @! s& I3 ?2 p; m! l# B   〈/table〉
0 V* g0 }! t) R% m7 Y9 o2 m( o% a
  第二种比较简单,那就是用CSS(层叠样式表)强制定义,但是,有些比较老的浏览器不支持CSS,可能导致无法显示你所要求的效果。不过使用CSS定义,语句非常简洁,所作网页的容量也较小。它的*作方法是,在表格的最外围的相应最小单元的〈td〉标签中定义style="BORDER-postion: black 1px solid;",其中,Postion的参数有Left、Right、Top和Bottom,分别表示在单元的左、右、上、下显示一条1个像素宽的实线条。' v5 F& O. |! |9 y; n
2 [- k% c- `/ `3 }
  源代码如下:: ^, |0 `; t0 q

& P9 z$ T& L7 P3 j1 W9 D  〈table border="0" bgcolor=white〉
4 E7 \8 {5 j" y" @2 ^* v3 D  Q9 G( V5 J: |8 h9 A
   〈tr〉 ! H% E) e2 j: R& o
8 Q7 }/ Q" g1 e9 i" n# `' Y
   〈td style="BORDER-left: black 1px solid; BORDER-top: black 1px solid;"〉+ E' |+ _; O% V  V2 Y8 L
. U% h9 L& i2 n; U0 l
   〈/td〉
) ?5 j) J7 f; Q( h4 G7 D! o( h7 E8 X; L
   〈td style="BORDER-top: black 1px solid; BORDER-right: black 1px solid;"〉4 W6 f' A2 D2 I& t6 Z% N

# G* p4 o9 h) d' ?4 \& f1 n   〈/td〉9 O; ^6 p+ i7 k
0 C2 a/ w- j9 X1 C6 z
   〈/tr〉9 t* \8 l- O4 y/ f+ D3 W1 {

* H+ z  z5 Z; M5 e8 |- w, N% V) U   〈tr〉 , l' S2 I4 \$ b! ~

' a0 S" l' I, Q   〈td style="BORDER-left: black 1px solid; BORDER-bottom: black 1px solid;"〉
3 z) X5 Z# H7 s
+ w. g8 }  q% G3 S, Z   〈/td〉9 P4 ~7 }$ K- f8 f

1 T  x% L5 ?* g& _2 h2 `' K   〈td style="BORDER-bottom: black 1px solid; BORDER-right: black 1px solid;"〉$ K( s/ j+ H2 @2 L3 K

$ P- y" D. [, Z' Z5 m+ H1 @" T' m
   〈/td〉
! f. i) w, S9 r1 w( k( A+ X- U& F! ]2 M1 T
   〈/tr〉
# }' v6 O/ E" i  p2 [& P
3 E# V$ I! N2 O( g6 V9 ^7 T  〈/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-10-7 06:57

Powered by iLang

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

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