﻿<?xml version="1.0" encoding="utf-8" standalone="yes"?><rss version="2.0" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:trackback="http://madskills.com/public/xml/rss/module/trackback/" xmlns:wfw="http://wellformedweb.org/CommentAPI/" xmlns:slash="http://purl.org/rss/1.0/modules/slash/"><channel><title>IT博客网-青蛙學堂-随笔分类-網頁</title><link>http://www.cnitblog.com/yide/category/6349.html</link><description /><language>zh-cn</language><lastBuildDate>Tue, 06 Nov 2007 23:01:39 GMT</lastBuildDate><pubDate>Tue, 06 Nov 2007 23:01:39 GMT</pubDate><ttl>60</ttl><item><title>html--css</title><link>http://www.cnitblog.com/yide/archive/2007/11/06/35917.html</link><dc:creator>青蛙學堂</dc:creator><author>青蛙學堂</author><pubDate>Tue, 06 Nov 2007 01:28:00 GMT</pubDate><guid>http://www.cnitblog.com/yide/archive/2007/11/06/35917.html</guid><wfw:comment>http://www.cnitblog.com/yide/comments/35917.html</wfw:comment><comments>http://www.cnitblog.com/yide/archive/2007/11/06/35917.html#Feedback</comments><slash:comments>1</slash:comments><wfw:commentRss>http://www.cnitblog.com/yide/comments/commentRss/35917.html</wfw:commentRss><trackback:ping>http://www.cnitblog.com/yide/services/trackbacks/35917.html</trackback:ping><description><![CDATA[<p><span>&nbsp;
<p>CSS全称Cascading Style Sheet。层叠式样式表。<br>一、CSS的四种实现方式：<br>1.内嵌式：</p>
<p>2.外链式：</p>
<p>3.导入式</p>
<p>4.属性式：</p>
<p>二.CSS的定义：<br>选择对象{属性1:值1;属性2:值2;属性3:值3;属性n:值n&#8230;&#8230;}<br>如：<br>td{font-size:12px;color:#FFFF00}<br>.myname{font-size:12px;color:#FFFF00}<br>a:hover{font-size:12px;color:#FFFF00;text-decoration: underline;}</p>
<p>三.四种选择对象<br>1.HTML selector (TagName)<br>2.class selector (.NAME)<br>3.ID selector (#IDname)<br>4.特殊对象 (a:hover　a:link　a:visited　a:active)</p>
<p>1.HTML selector<br>HTML selector就是HTML的置标符，如：DIV、TD、H1。HTML selector的作用范围是应用了该样式的所有页面中的所有该置标符。<br>例：<br>td<br>{<br>color: #FF0000;<br>} <br>--&gt;<br>注意：代码的作用是使表格单元格内文字自动变红色。</p>
<p>2.class selector<br>定义class selector需要往其名称其加一个点&#8220;.&#8221;。如&#8220;.classname&#8221;。class selector的作用范围是所有包含&#8220;class="classname"&#8221;的置标符。<br>例：<br>.fontRed<br>{<br>color: #FF0000; <br>}<br>--&gt;<br>注意：在第二个中没有&#8220;class="fontRed"&#8221;，所以文字没有变红色。</p>
<p>3.ID selector<br>定义ID selector需要往其名称其加一个点&#8220;#&#8221;。如&#8220;#IDname&#8221;。ID selector的作用范围是所有包含&#8220;ID="classname"&#8221;的置标符。<br>例：</p>
<p>#fontRed<br>{<br>color: #FF0000;<br>}<br>--&gt;&nbsp;&nbsp;<br>注意：在第二个中没有&#8220;ID="fontRed"&#8221;，所以文字没有变红色。</p>
<p>4.特殊对象<br>特殊对象包括四种，是针对链接对象设置的:<br>a:hover 鼠标移上时的超链接<br>a:link 常规，非访问超链接<br>a:visited 访问过的超链接<br>a:active 鼠标点击时的超链接<br>特殊对象的作用范围是所有置标符（这句话有待商榷，因为下面很快就有一种方法可以把&#8220;所有&#8221;两个字推翻）。<br>例：<br>a:hover<br>{<br>color: #0000FF;<br>text-decoration: underline;<br>}<br>--&gt;<br>注意下面，很有用！！！<br>a.classname:hover<br>a#IDname:hover<br>这两种写法，是分别配合.classname与#IDname使用的。它的作用范围变成了所有包含&#8220;class="classname"&#8221;或&#8220;ID="IDname"&#8221;的置标符。这种写法，可以帮助你在同一页面中实现多种a:hover效果，可以看一下艺网的主页上导航栏文字与普通文章标题在鼠标时的区别。</p>
<p>四.应用：<br>1.置标符　自动应用<br>2.特制类　class="NAME"<br>3.ID&nbsp;&nbsp; ID="IDname"<br>4.特殊对象　自动应用<br>五.CSS属性<br>CSS的属性有很多，像上文中用到最多的color，表示文字的颜色。background-color表示背景色。这个是最主要的，但是因为没有什么难度，参考一下相关手册就可以了。</p>
<p>CSS 标签属性/属性参考<br>这里列出了目前支持的样式表(CSS)标签属性。</p>
<p><strong>CSS 标签属性/属性</strong></p>
<p>行为属性 behavior</p>
<p>字体和文本属性 direction<br>direction <br>font <br>font-family <br>font-size <br>font-style <br>font-variant <br>font-weight <br>ime-mode<br>layout-grid<br>layout-grid-char<br>layout-grid-line<br>layout-grid-mode<br>layout-grid-type<br>letter-spacing <br>line-break<br>line-height <br>min-height<br>ruby-align<br>ruby-overhang<br>ruby-position<br>text-align <br>text-autospace<br>text-decoration <br>text-indent <br>text-justify<br>text-kashida-space<br>text-overflow <br>text-transform <br>text-underline-position<br>unicode-bidi <br>vertical-align <br>white-space<br>word-break<br>word-wrap<br>writing-mode<br></p>
</span>
<img src ="http://www.cnitblog.com/yide/aggbug/35917.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.cnitblog.com/yide/" target="_blank">青蛙學堂</a> 2007-11-06 09:28 <a href="http://www.cnitblog.com/yide/archive/2007/11/06/35917.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>c#--menu</title><link>http://www.cnitblog.com/yide/archive/2007/11/05/35890.html</link><dc:creator>青蛙學堂</dc:creator><author>青蛙學堂</author><pubDate>Mon, 05 Nov 2007 07:08:00 GMT</pubDate><guid>http://www.cnitblog.com/yide/archive/2007/11/05/35890.html</guid><wfw:comment>http://www.cnitblog.com/yide/comments/35890.html</wfw:comment><comments>http://www.cnitblog.com/yide/archive/2007/11/05/35890.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.cnitblog.com/yide/comments/commentRss/35890.html</wfw:commentRss><trackback:ping>http://www.cnitblog.com/yide/services/trackbacks/35890.html</trackback:ping><description><![CDATA[<p>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>"&gt;<br>&lt;html xmlns="<a href="http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a>"&gt;<br>&lt;head&gt;<br>&lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;<br>&lt;title&gt;二?dropdown?出菜?--A CROSS BROWSER DROP DOWN CASCADING VALIDATING MENU&lt;/title&gt;<br>&lt;style type="text/css"&gt;<br>/* common styling */<br>/* set up the overall width of the menu div, the font and the margins */</p>
<p>.menu {<br>font-family: arial, sans-serif; <br>width:750px; <br>margin:0; <br>margin:50px 0;<br>}<br>/* remove the bullets and set the margin and padding to zero for the unordered list */<br>.menu ul {<br>padding:0; <br>margin:0;<br>list-style-type: none;<br>}<br>/* float the list so that the items are in a line and their position relative so that the drop down list will appear in the right place underneath each list item */<br>.menu ul li {<br>float:left; <br>position:relative;<br>}<br>/* style the links to be 104px wide by 30px high with a top and right border 1px solid white. Set the background color and the font size. */<br>.menu ul li a, .menu ul li a:visited {<br>display:block; <br>text-align:center; <br>text-decoration:none; <br>width:104px; <br>height:30px; <br>color:#000; <br>border:1px solid #fff;<br>border-width:1px 1px 0 0;<br>background:#c9c9a7; <br>line-height:30px; <br>font-size:11px;<br>}<br>/* make the dropdown ul invisible */<br>.menu ul li ul {<br>display: none;<br>}</p>
<p>/* specific to non IE browsers */<br>/* set the background and foreground color of the main menu li on hover */<br>.menu ul li:hover a {<br>color:#fff; <br>background:#b3ab79;<br>}<br>/* make the sub menu ul visible and position it beneath the main menu list item */<br>.menu ul li:hover ul {<br>display:block; <br>position:absolute; <br>top:31px; <br>left:0; <br>width:105px;<br>}<br>/* style the background and foreground color of the submenu links */<br>.menu ul li:hover ul li a {<br>display:block; <br>background:#faeec7; <br>color:#000;<br>}<br>/* style the background and forground colors of the links on hover */<br>.menu ul li:hover ul li a:hover {<br>background:#dfc184; <br>color:#000;<br>}</p>
<p>&lt;/style&gt;<br>&lt;!--[if lte IE 6]&gt;</p>
<p>&lt;style type="text/css"&gt;<br>/* styling specific to Internet Explorer IE5.5 and IE6. Yet to see if IE7 handles li:hover */</p>
<p>/* Get rid of any default table style */<br>table {<br>border-collapse:collapse;<br>margin:0; <br>padding:0;<br>}<br>/* ignore the link used by 'other browsers' */<br>.menu ul li a.hide, .menu ul li a:visited.hide {<br>display:none;<br>}<br>/* set the background and foreground color of the main menu link on hover */<br>.menu ul li a:hover {<br>color:#fff; <br>background:#b3ab79;<br>}<br>/* make the sub menu ul visible and position it beneath the main menu list item */<br>.menu ul li a:hover ul {<br>display:block; <br>position:absolute; <br>top:32px; <br>left:0; <br>width:105px;<br>}<br>/* style the background and foreground color of the submenu links */<br>.menu ul li a:hover ul li a {<br>background:#faeec7; <br>color:#000;<br>}<br>/* style the background and forground colors of the links on hover */<br>.menu ul li a:hover ul li a:hover {<br>background:#dfc184; <br>color:#000;<br>}</p>
<p>&lt;/style&gt;</p>
<p>&lt;![endif]--&gt;<br>&lt;/head&gt;</p>
<p>&lt;body&gt;</p>
<p>&lt;div class="menu"&gt;</p>
<p>&lt;ul&gt;<br>&lt;li&gt;&lt;a class="hide" href="../menu/index.html"&gt;DEMOS&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="../menu/index.html"&gt;DEMOS<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/zero_dollars.html" title="The zero dollar ads page"&gt;zero dollars&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/embed.html" title="Wrapping text around images"&gt;wrapping text&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/form.html" title="Styling forms"&gt;styled form&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/nodots.html" title="Removing active/focus borders"&gt;active focus&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/shadow_boxing.html" title="Multi-position drop shadow"&gt;shadow boxing&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/old_master.html" title="Image Map for detailed information"&gt;image map&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/bodies.html" title="fun with background images"&gt;fun backgrounds&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/fade_scroll.html" title="fade-out scrolling"&gt;fade scrolling&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../menu/em_images.html" title="em size images compared"&gt;em sized images&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;</p>
<p>&lt;li&gt;&lt;a class="hide" href="index.html"&gt;MENUS&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="index.html"&gt;MENUS<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="spies.html" title="a coded list of spies"&gt;spies menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="vertical.html" title="a horizontal vertical menu"&gt;vertical menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="expand.html" title="an enlarging unordered list"&gt;enlarging list&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="enlarge.html" title="an unordered list with link images"&gt;link images&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="cross.html" title="non-rectangular links"&gt;non-rectangular&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="jigsaw.html" title="jigsaw links"&gt;jigsaw links&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="circles.html" title="circular links"&gt;circular links&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;</p>
<p>&lt;li&gt;&lt;a class="hide" href="../layouts/index.html"&gt;LAYOUTS&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="../layouts/index.html"&gt;LAYOUTS<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../layouts/bodyfix.html" title="Cross browser fixed layout"&gt;Fixed 1&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../layouts/body2.html" title="Cross browser fixed layout"&gt;Fixed 2&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../layouts/body4.html" title="Cross browser fixed layout"&gt;Fixed 3&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../layouts/body5.html" title="Cross browser fixed layout"&gt;Fixed 4&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../layouts/minimum.html" title="A simple minimum width layout"&gt;minimum width&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;</p>
<p>&lt;li&gt;&lt;a class="hide" href="../boxes/index.html"&gt;BOXES&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="../boxes/index.html"&gt;BOXES<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="spies.html" title="a coded list of spies"&gt;spies menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="vertical.html" title="a horizontal vertical menu"&gt;vertical menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="expand.html" title="an enlarging unordered list"&gt;enlarging list&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="enlarge.html" title="an unordered list with link images"&gt;link images&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="cross.html" title="non-rectangular links"&gt;non-rectangular&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="jigsaw.html" title="jigsaw links"&gt;jigsaw links&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="circles.html" title="circular links"&gt;circular links&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;</p>
<p>&lt;li&gt;&lt;a class="hide" href="../mozilla/index.html"&gt;MOZILLA&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="../mozilla/index.html"&gt;MOZILLA<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/dropdown.html" title="A drop down menu"&gt;drop down menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/cascade.html" title="A cascading menu"&gt;cascading menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/content.html" title="Using content:"&gt;content:&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/moxbox.html" title=":hover applied to a div"&gt;mozzie box&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/rainbow.html" title="I can build a rainbow"&gt;rainbow box&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/snooker.html" title="Snooker cue"&gt;snooker cue&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/target.html" title="Target Practise"&gt;target practise&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/splittext.html" title="Two tone headings"&gt;two tone headings&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../mozilla/shadow_text.html" title="Shadow text"&gt;shadow text&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;</p>
<p>&lt;li&gt;&lt;a class="hide" href="../ie/index.html"&gt;EXPLORER&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="../ie/index.html"&gt;EXPLORER<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../ie/exampleone.html" title="Example one"&gt;example one&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../ie/weft.html" title="Weft fonts"&gt;weft fonts&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../ie/exampletwo.html" title="Vertical align"&gt;vertical align&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;</p>
<p>&lt;li&gt;&lt;a class="hide" href="../opacity/index.html"&gt;OPACITY&lt;/a&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;a href="../opacity/index.html"&gt;OPACITY<br>&lt;table&gt;&lt;tr&gt;&lt;td&gt;<br>&lt;![endif]--&gt;</p>
<p>&nbsp;&nbsp;&nbsp; &lt;ul&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../opacity/colours.html" title="colour wheel"&gt;opaque colours&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../opacity/picturemenu.html" title="a menu using opacity"&gt;opaque menu&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../opacity/png.html" title="partial opacity"&gt;partial opacity&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;li&gt;&lt;a href="../opacity/png2.html" title="partial opacity II"&gt;partial opacity II&lt;/a&gt;&lt;/li&gt;<br>&nbsp;&nbsp;&nbsp; &lt;/ul&gt;</p>
<p>&lt;!--[if lte IE 6]&gt;<br>&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;<br>&lt;/a&gt;<br>&lt;![endif]--&gt;</p>
<p>&lt;/li&gt;<br>&lt;/ul&gt;</p>
<p>&lt;!-- clear the floats if required --&gt;<br>&lt;div class="clear"&gt;&amp;nbsp;&lt;/div&gt;</p>
<p>&lt;/div&gt;<br>&lt;/body&gt;<br>&lt;/html&gt;<br></p>
<img src ="http://www.cnitblog.com/yide/aggbug/35890.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.cnitblog.com/yide/" target="_blank">青蛙學堂</a> 2007-11-05 15:08 <a href="http://www.cnitblog.com/yide/archive/2007/11/05/35890.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>C#_Conn_db</title><link>http://www.cnitblog.com/yide/archive/2007/10/30/35588.html</link><dc:creator>青蛙學堂</dc:creator><author>青蛙學堂</author><pubDate>Tue, 30 Oct 2007 06:06:00 GMT</pubDate><guid>http://www.cnitblog.com/yide/archive/2007/10/30/35588.html</guid><wfw:comment>http://www.cnitblog.com/yide/comments/35588.html</wfw:comment><comments>http://www.cnitblog.com/yide/archive/2007/10/30/35588.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.cnitblog.com/yide/comments/commentRss/35588.html</wfw:commentRss><trackback:ping>http://www.cnitblog.com/yide/services/trackbacks/35588.html</trackback:ping><description><![CDATA[<div align=center>
<h1 class=aTitle>深入分析ADO.NET中的DataSet对象</h1>
</div>
<table width="97%" align=center>
    <tbody>
        <tr>
            <td width=120>[日期：<span id=TimeLabel>2006-1-6</span>]</td>
            <td align=middle>来源：<span id=SourceLabel></span>&nbsp; 作者：<span id=AuthorLabel></span></td>
            <td align=right width=100>[字体：<a href="javascript:ContentSize(16)"><u><font color=#0000ff>大</font></u></a> <a href="javascript:ContentSize(14)"><u><font color=#0000ff>中</font></u></a> <a href="javascript:ContentSize(12)"><u><font color=#0000ff>小</font></u></a>] </td>
        </tr>
    </tbody>
</table>
<div class=content id=BodyLabel style="PADDING-RIGHT: 10px; DISPLAY: block; PADDING-LEFT: 10px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px">　　ADO.NET是.Net FrameWork SDK中用以操作数据库的类库的总称。而DataSet类则是ADO.NET中最核心的成员之一，也是各种开发基于.Net平台程序语言开发数据库应用程序最常接触的类。之所以DataSet类在ADO.NET中具有特殊的地位，是因为DataSet在ADO.NET实现从数据库抽取数据中起到关键作用，在从数据库完成数据抽取后，DataSet就是数据的存放地，它是各种数据源中的数据在计算机内存中映射成的缓存，所以有时说DataSet可以看成是一个数据容器。同时它在客户端实现读取、更新数据库等过程中起到了中间部件的作用（DataReader只能检索数据库中的数据）。<br><br>　　各种.Net平台开发语言开发数据库应用程序，一般并不直接对数据库操作（直接在程序中调用存储过程等除外），而是先完成数据连接和通过数据适配器填充DataSet对象，然后客户端再通过读取DataSet来获得需要的数据，同样更新数据库中数据，也是首先更新DataSet，然后再通过DataSet来更新数据库中对应的数据的。可见了解、掌握ADO.NET，首先必须了解、掌握DataSet。DataSet主要有三个特性：<br><br>　　1. 独立性。DataSet独立于各种数据源。微软公司在推出DataSet时就考虑到各种数据源的多样性、复杂性。在.Net中，无论什么类型数据源，它都会提供一致的关系编程模型，而这就是DataSet。<br><br>　　2. 离线（断开）和连接。DataSet既可以以离线方式，也可以以实时连接来操作数据库中的数据。这一点有点像ADO中的RecordSet。<br><br>　　3. DataSet对象是一个可以用XML形式表示的数据视图，是一种数据关系视图。<br><br>　　<strong>一.DataSet对象的结构模型及和RecordSet的比较</strong><br><br>　　虽说ADO.NET是 ADO在.Net平台下得后继版本，但二者的区别是很大的。突出表现在ADO中的RecordSet对象和ADO.NET中的DataSet对象。RecordSet其实也是非常灵活的一个对象，微软公司推出它也是煞费苦心，如：RecordSet可以离线操作数据库，性能优良，效率较高等等这些都让当时的程序员为之一振。RecordSet虽然已经很复杂，但DataSet却比RecordSet复杂的多，我们知道每一DataSet往往是一个或多个DataTable 对象的集合，这些对象由数据行和数据列以及主键、外键、约束和有关DataTable对象中数据的关系信息组成。而RecordSet只能存放单张数据表，虽然这张数据表可以由几张数据表JOIN生成。所以有些时候说，RecordSet更类似于DataSet中的DataTable。DataSet对象的结构模型如图01所示：<br><br>
<table width="90%" align=center border=0>
    <tbody>
        <tr>
            <td>
            <div align=center><img onmousewheel="return bbimg(this)" onclick=ImgClick(this) height=345 onerror="this.src='http://www.yesky.com/image20010518/266317.gif';" hspace=3 src="http://www.zhuxiaolei.com/upload/060106091232081.gif" width=353 align=center vspace=1 border=1 resized="0"><br><span class=content>图01：DataSet对象的结构模型图 </span></div>
            </td>
        </tr>
    </tbody>
</table>
<br>　　通过图01可见在DataSet对象结构还是非常复杂的，在DataSet对象的下一层中是DataTableCollection对象、DataRelationCollection对象和ExtendedProperties对象。上文已经说过，每一个DataSet对象是由若干个DataTable对象组成。DataTableCollection就是管理DataSet中的所有DataTable对象。表示DataSet中两个DataTable对象之间的父/子关系是DataRelation对象。它使一个DataTable 中的行与另一个DataTable中的行相关联。这种关联类似于关系数据库中数据表之间的主键列和外键列之间的关联。DataRelationCollection对象就是管理DataSet中所有DataTable之间的DataRelation关系的。在DataSet中DataSet、DataTable和DataColumn都具有ExtendedProperties属性。ExtendedProperties其实是一个属性集（PropertyCollection），用以存放各种自定义数据，如生成数据集的SELECT语句等。<br><br>　　<strong>二．使用DataSet：</strong><br><br>　　DataSet其实就是数据集，上文已经说过DataSet是把数据库中的数据映射到内存缓存中的所构成的数据容器，对于任何数据源，它都提供一致的关系编程模型。在DataSet中既定义了数据表的约束关系以及数据表之间的关系，还可以对数据表中的数据进行排序等。DataSet使用方法一般有三种：<br><br>　　1. 把数据库中的数据通过DataAdapter对象填充DataSet。<br><br>　　2. 通过DataAdapter对象操作DataSet实现更新数据库。<br><br>　　3. 把XML数据流或文本加载到DataSet。<br><br>　　下面就来详细探讨以上DataSet使用方法的具体实现，使用语言是C＃。<br><br>　　1. 把数据库中的数据通过DataAdapter对象填充DataSet：<br><br>　　掌握DataSet使用方法必须掌握ADO.NET另外一个核心常用成员--数据提供者（Data Provider）。数据提供者（也称为托管提供者Managed Provider）是一个类集合，在.Net FrameWork SDK 1.0中数据提供者分为二种：The SQL Server .NET Data Provider和The OLE DB .NET Data Provider。而到了.Net FrameWork SDK 1.1时，ADO.NET中又增加了The ODBC .NET Data Provider和 The Oracle .NET Data Provider二个数据提供者。The SQL Server .NET Data Provider的操作数据库对象只限于Sql Server 7.0及以上版本，Oracle .NET Data Provider的操作数据库对象只限于Oracle 8.1.7及以上版本。而The OLE DB .NET Data Provider和The ODBC .NET Data Provider可操作的数据库类型就相对多了许多，只要它们在本地分别提供Ole Db提供程序和ODBC提供程序。<br><br>　　在这些数据提供者中都有一个DataAdapter类，如：OLE DB .NET Framework 数据提供者中是 OleDbDataAdapter类，The SQL Server .NET Framework 数据提供者中是SqlDataAdapter类，The ODBC .NET Framework 数据提供者中是OdbcDataAdapter类。通过这些DataAdapter就能够实现从数据库中检索数据并填充 DataSet 中的表。<br><br>　　DataAdapter填充DataSet的过程分为二步：首先通过DataAdapter的SelectCommand属性从数据库中检索出需要的数据。SelectCommand其实是一个Command对象。然后再通过DataAdapter的Fill方法把检索来的数据填充 DataSet。代码清单01就是以Microsoft SQL Server 中的Northwind数据库为对象，C＃使用The SQL Server .NET Data Provider中的SqlDataAdapter填充DataSet的具体实现方法：<br><br>　　代码清单01：<br><br>
<table class=content borderColor=#ffcc66 width="90%" align=center bgColor=#dadacf border=0>
    <tbody>
        <tr>
            <td height=233>SqlConnection sqlConnection1 = new SqlConnection ( "Data Source=localhost ;Integrated Security=SSPI ;Initial Catalog=Northwind" ) ;<br>//创建数据连接<br>SqlCommand selectCMD = new SqlCommand ( "SELECT CustomerID , CompanyName FROM Customers" , sqlConnection1 ) ;<br>//创建并初始化SqlCommand对象<br>SqlDataAdapter sqlDataAdapter1 = new SqlDataAdapter ( ) ;<br>custDA.SelectCommand = selectCMD ;<br>sqlConnection.Open ( ) ;<br>//创建SqlDataAdapter对象，并根据SelectCommand属性检索数据<br>DataSet dsDataSet1 = new DataSet ( ) ;<br>sqlDataAdapter1.Fill ( dsDataSet1 , "Customers" ) ;<br>//使用SqlDataAdapter的Fill方法填充DataSet<br>sqlConnection.Close ( ) ;<br>//关闭数据连接</td>
        </tr>
    </tbody>
</table>
<br>　　对于其他数据提供者的DataAdapter，具体的实现检索数据库中的数据并填充DataSet的实现方法类似于以上方法。<br><br>　　2. 通过DataAdapter对象操作DataSet实现更新数据库：<br><br>　　DataAdapter是通过其Update方法实现以DataSet中数据来更新数据库的。当DataSet实例中包含数据发生更改后，此时调用Update方法，DataAdapter 将分析已作出的更改并执行相应的命令（INSERT、UPDATE 或 DELETE），并以此命令来更新数据库中的数据。如果DataSet中的DataTable是映射到单个数据库表或从单个数据库表生成，则可以利用 CommandBuilder 对象自动生成 DataAdapter 的 DeleteCommand、InsertCommand 和 UpdateCommand。使用DataAdapter对象操作DataSet实现更新数据库具体的实现方法，只需把下面的代码清单02添加到代码清单01之后，二者合并即可实现删除Customers数据表中第一行数据：<br><br>　　代码清单02：　<br><br>
<table borderColor=#ffcc66 width="90%" align=center bgColor=#dadacf border=0>
    <tbody>
        <tr>
            <td class=content>SqlCommandBuilder sqlCommandBuilder1 = new SqlCommandBuilder ( sqlDataAdapter1 ) ;<br>//以sqlDataAdapter1为参数来初始化SqlCommandBuilder实例<br>dsDataSet1.Tables["Customers"].Rows[0].Delete ( ) ;<br>//删除DataSet中删除数据表Customers中第一行数据<br>sqlDataAdapter1.Update ( dsDataSet1 ,"Customers" ) ;<br>//调用Update方法，以DataSet中的数据更新从数据库<br>dsDataSet1.Tables["Customers"].AcceptChanges ( ) ;</td>
        </tr>
    </tbody>
</table>
<br>　　由于不了解DataSet结构和与数据库关系，很多初学者往往只是更新了DataSet中的数据，就认为数据库中的数据也随之更新，所以当打开数据库浏览时发现并没有更新数据，都会比较疑惑，通过上面的介绍，疑惑应当能够消除了。<br><br>　　3. XML和DataSet：<br><br>　　DataSet中的数据可以从XML数据流或文档创建。并且.Net Framework可以控制加载XML数据流或文档中那些数据以及如何创建DataSet的关系结构。加载XML数据流和文档到DataSet中是可使用DataSet对象的ReadXml方法（注意：ReadXml来加载非常大的文件，则性能会有所下降）。ReadXml 方法将从文件、流或 XmlReader 中进行读取，并将 XML 的源以及可选的 XmlReadMode 参数用作参数。该ReadXml方法读取 XML 流或文档的内容并将数据加载到 DataSet 中。根据所指定的XmlReadMode和关系架构是否已存在，它还将创建DataSet的关系架构。<br>
<p>　<strong>三．DataSet和数据绑定（DataBinding）</strong><br><br>　　数据绑定是数据绑定是绑定技术中使用最频繁，也是最为重要的技术，也可以说是各种.Net开发语言开发数据库应用程序最需要掌握的基本的知识之一。数据绑定之所以很重要，是因为在.Net FrameWork SDK中并没有提供数据库开发的相关组件，即如：DbTextBox、DbLabel等用于数据库开发的常用组件在.Net FrameWork SDK中都没有。而数据绑定技术则能够把TextBox组件"改造"成DbTextBox组件，把Label组件"改造"成DbLabel组件等等。所有这些都与DataSet有直接关系。<br><br>　　数据绑定分成二类：简单型数据绑定和复杂型数据绑定。适用于简单型数据绑定组件一般有Lable、TextBox等，适用于复杂性数据绑定的组件一般有DataGrid、ListBox、ComboBox等。其实简单型数据绑定和复杂性数据绑定并没有明确的区分，只是在组件进行数据绑定时，一些结构复杂一点的组件在数据绑定时操作步骤相近，而另外一些结构简单一点的组件在数据绑定时也比较类似。于是也就产生了二个类别。以下就结合TextBox组件和DataGrid组件分别探讨DataSet在实现简单型数据绑定和复杂性数据绑定作用和具体实现方法。<br><br>　　1. 简单型数据绑定：<br><br>　　简单型数据绑定一般使用这些组件中的DataBindings属性的Add方法把DataSet中某一个DataTable中的某一行和组件的某个属性绑定起来，从而达到显示数据的效果。TextBox组件的数据绑定具体实现方法是在代码清单01后，再添加代码清单03中的代码，代码清单03中的代码是把DataSet中的Customers 数据表中的"CustomerID"的数据和TextBox的Text属性绑定起来，这样DbTextBox就产生了。其他适用于简单型数据绑定组件数据绑定的方法类似与此操作：<br><br>　　代码清单03：
<table class=content width="90%" align=center bgColor=#dadacf>
    <tbody>
        <tr>
            <td>textBox1.DataBindings.Add ( "Text" , dsDataSet1, " Customers. CustomerID " ) ;</td>
        </tr>
    </tbody>
</table>
<br>　　2. 复杂性数据绑定：<br><br>　　复杂性数据绑定一般是设定组件的DataSource属性和DisplayMember属性来完成数据绑定的。DataSource属性值一般设定为要绑定的DataSet，DisplayMember属性值一般设定为要绑定的数据表或数据表中的某一列。DataGrid组件的数据绑定的一般实现方法是在代码清单01后，再添加代码清单04中的代码，代码清单04的功能是把DataSet中的Customers 数据表和DataGrid绑定起来。其他适用于复杂性数据绑定的组件实现数据绑定的方法类似此操作：<br><br>　　代码清单04：<br><br>
<table class=content borderColor=#ffcc66 width="90%" align=center bgColor=#dadacf border=0>
    <tbody>
        <tr>
            <td height=36>dataGrid1.DataSource = dsDataSet1 ;<br>dataGrid1.DataMember = " Customers " ;</td>
        </tr>
    </tbody>
</table>
<br>　　<strong>四．总结</strong><br><br>　　DataSet类是ADO.NET中一个非常重要的核心成员，它是数据库中的数据在本地计算机中映射成的缓存。对DataSet的任何操作，都是在计算机缓存中完成的。理解这一点是掌握DataSet的第一步。DataSet虽然结构复杂。但只要区分DataSet对象中各个组成部件及其相互关系，掌握也不算太困难。本文覆盖了DataSet的特性、结构、以及具体的使用方法等等，相信这些对您掌握这个ADO.NET中核心成员是有所帮助。</p>
<script event=onload for=window type=text/javascript>ImgLoad(document.getElementById("BodyLabel"));</script></div>
<br>
<img src ="http://www.cnitblog.com/yide/aggbug/35588.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.cnitblog.com/yide/" target="_blank">青蛙學堂</a> 2007-10-30 14:06 <a href="http://www.cnitblog.com/yide/archive/2007/10/30/35588.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>menu</title><link>http://www.cnitblog.com/yide/archive/2007/10/17/34998.html</link><dc:creator>青蛙學堂</dc:creator><author>青蛙學堂</author><pubDate>Wed, 17 Oct 2007 07:20:00 GMT</pubDate><guid>http://www.cnitblog.com/yide/archive/2007/10/17/34998.html</guid><wfw:comment>http://www.cnitblog.com/yide/comments/34998.html</wfw:comment><comments>http://www.cnitblog.com/yide/archive/2007/10/17/34998.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.cnitblog.com/yide/comments/commentRss/34998.html</wfw:commentRss><trackback:ping>http://www.cnitblog.com/yide/services/trackbacks/34998.html</trackback:ping><description><![CDATA[<p>&lt;!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"&gt;<br>&lt;html&gt;<br>&lt;head&gt;<br>&lt;title&gt;AgetimeMenu Demo&lt;/title&gt;<br>&lt;meta http-equiv="Content-Type" content="text/html; charset=gb2312"&gt;<br>&lt;style&gt;<br>.agetime_bar{<br>position:absolute;top:0px;left:0px;height:22px;width:100%;border:1px outset;background-color:RGB(212,208,200);z-index:98;<br>}<br>.agetime_barItem{<br>width:60px;height:20px;border:1px solid RGB(212,208,200);text-align:left;padding-left:10px;<br>background:RGB(212,208,200);color:#000000;font-size:9pt;<br>}<br>.agetime_barItemDown{<br>width:60px;height:20px;border:1px inset RGB(212,208,200);text-align:left;padding-left:10px;<br>background:#F0F0F0;color:#000000;font-size:9pt;<br>}<br>.agetime_barItemHover{<br>width:60px;height:20px;border:1 outset;text-align:left;padding-left:10px;<br>background:#F0F0F0;color:#000000;font-size:9pt;<br>}<br>.agetime_pad{<br>cursor:default;font-size:9pt;width:100%;<br>}<br>.agetime_padItem{<br>width:100%;height:18px;border:1px solid RGB(212,208,200);text-align:left;padding-left:10px;<br>background:RGB(212,208,200);color:#000000;font-size:9pt;<br>}<br>.agetime_padItemFalse{<br>padding-left:10px;font-size:9pt; color:#808080;<br>}<br>.agetime_padItemFalseHover{<br>padding-left:10px;font-size:9pt; color:#808080;background-color:#333366;<br>}<br>.agetime_padItemHover{<br>width:100%;height:18px;text-align:left;padding-left:10px;<br>background-color:#333366;color:#FFFFFF;font-size:9pt;<br>}<br>.agetime_padItemDown{<br>width:100%;height:18px;text-align:left;padding-left:10px;border:1px inset;<br>background-color:#9999CC;color:#FFFFFF;font-size:9pt;<br>}<br>.agetime_hr{<br>border:1px inset;<br>}<br>.agetime_board{<br>background-color:RGB(212,208,200);border:2px outset;<br>}<br>&lt;/style&gt;<br>&lt;/head&gt;</p>
<p>&lt;body&gt;<br>&lt;script language="javascript"&gt;<br>var menu = agetimeMenu("agetime",<br>[<br>[<br>["OPEN",null,null,true,"OPEN FILE"], //顯示文字,方法,命令,狀態,狀態顯示文字<br>["打開",null,null,false,"打開文件"],<br>["--"],<br>["你好","js","alert('Hello')",true,"一聲問候"],<br>["新窗口","ABC","about:blank",true,"彈出ABC窗口"],<br>["空白",null,"about:blank",true,"在當前窗口顯示空白頁"]<br>],<br>[<br>["編輯",null,null,false,"打開文件"],<br>["撤消",null,null,true,"打開文件"],<br>["重做",null,null,true,"打開文件"]<br>],<br>[<br>["文件","js","alert('無子菜單')",true,"打開文件"]<br>]<br>]<br>);</p>
<p>function agetimeMenu(id,array){<br>var menu=this;<br>menu.pad=null; //裝載各個子菜單<br>menu.barItems=[]; //菜單條的各位按鈕<br>menu.pads=[]; //每個子菜單為一個table存放于menu.pad上;<br>menu.selectedIndex=-1; //菜單條選中按鈕的索引值<br>menu.board=null; //子菜單面板</p>
<p>//建立菜單條<br>this.crtMenuBar=function(){<br>var len=array.length;<br>menu.bar = document.body.appendChild(document.createElement('div'));<br>menu.bar.className=id+"_bar";<br>for(var i=0;i&lt;len;i++){<br>menu.barItems[i]=menu.addMenuBarItem(array[i][0],i);<br>menu.addMenuPad(array[i],i);<br>}<br>}</p>
<p>//子菜單<br>this.addMenuPad=function(ary,index){<br>var len=ary.length;<br>var pad=menu.crtElement("table",menu.pad);<br>pad.cellSpacing=1; pad.cellPadding=0;<br>pad.className=id+"_pad";<br>pad.style.display="none";<br>for(var i=1;i&lt;len;i++){<br>var Row=pad.insertRow(i-1);<br>menu.addMenuPadItem(ary[i],Row);<br>}<br>menu.pads[index]=pad;<br>}</p>
<p>//各子菜單按鈕<br>this.addMenuPadItem=function(ary,Row){<br>var Cell=Row.insertCell(0);<br>if(ary[0]!="--"){<br>Cell.innerText=ary[0];<br>if(ary[3]){ //有效狀態;<br>Cell.className=id+"_padItem";<br>Cell.onmouseover=function(){<br>Cell.className=id+"_padItemHover";<br>window.status=ary[4];<br>}<br>Cell.onmouseout=function(){<br>Cell.className=id+"_padItem";<br>window.status="";<br>}<br>Cell.onmousedown=function(){ Cell.className=id+"_padItemDown"; }<br>Cell.onmouseup=function(){ <br>Cell.className=id+"_padItemHover";<br>menu.hideMenu();<br>menu.execute(ary);<br>}<br>}<br>else{ //按鈕無效;<br>Cell.className=id+"_padItemFalse";<br>Cell.onmouseover=function(){<br>Cell.className=id+"_padItemFalseHover";<br>window.status=ary[4];<br>}<br>Cell.onmouseout=function(){<br>Cell.className=id+"_padItemFalse";<br>window.status="";<br>}<br>}<br>}<br>else{<br>var hr=menu.crtElement("hr",Cell);<br>hr.className=id+"_hr";<br>}<br>Cell.onclick=function(){<br>event.cancelBubble=true;<br>}<br>}</p>
<p>//菜單條的按鈕<br>this.addMenuBarItem=function(ary,index){<br>var item=menu.crtElement("button",menu.bar);<br>item.value=ary[0];<br>item.disabled=!ary[3];<br>item.className=id+"_barItem";<br>item.onmouseover=function(){<br>if(menu.selectedIndex==-1){<br>item.className=id+"_barItemHover";<br>}<br>else{<br>menu.barItems[selectedIndex].className=id+"_barItem";<br>item.className=id+"_barItemDown";<br>menu.showMenu(index);<br>}<br>window.status=ary[4];<br>}<br>item.onmouseout=function(){<br>if(menu.selectedIndex==-1) item.className=id+"_barItem"; <br>window.status="";<br>}<br>item.onclick=function(){ <br>event.cancelBubble=true;<br>if(menu.selectedIndex==-1){<br>item.className=id+"_barItemDown"; <br>menu.showMenu(index);<br>}<br>else{<br>menu.hideMenu();<br>item.className=id+"_barItemHover"; <br>}<br>menu.execute(ary);<br>item.blur(); <br>}<br>return item;<br>}</p>
<p>//顯示子菜單<br>this.showMenu=function(index){<br>if(menu.selectedIndex!=-1) menu.pads[selectedIndex].style.display="none";<br>menu.board.style.pixelLeft=menu.barItems[index].offsetLeft+2;<br>//menu.board.style.pixelHeight="";<br>if(menu.pads[index].rows.length&gt;0) menu.board.style.display="";<br>else menu.board.style.display="none";<br>menu.pads[index].style.display="";<br>menu.selectedIndex=index;<br>}<br>//隱藏子菜單<br>this.hideMenu=function(){<br>if(menu.selectedIndex==-1) return;<br>menu.barItems[menu.selectedIndex].className=id+"_barItem";<br>menu.pads[selectedIndex].style.display="none";<br>menu.selectedIndex=-1;<br>menu.board.style.display="none";<br>}</p>
<p>//執行菜單命令;<br>this.execute=function(ary){<br>if(ary[2]==null) return;<br>if(ary[1]=="js") { eval(ary[2]); menu.hideMenu(); }<br>else if(ary[1]==null || ary[1].toLowerCase=="_self") location.href=ary[2];<br>else{ var x=window.open(ary[2],ary[1]); x.focus(); }<br>}</p>
<p>//建立子菜單的顯示面板<br>this.crtMenuBoard=function(){<br>document.write(<br>"&lt;div id='"+id+"_board' style='position:absolute;width:160px;height:10px;left:0px;top:20px;background-color:#666666;z-index:99;display:none;'&gt;"+<br>"&lt;div style='position:absolute;width:100%;height:100%;left:0px;top:0px;'&gt;"+<br>"&lt;iframe id='"+id+"_frame' name='"+id+"_frame' width='100%' height='100%' frameborder='0' scrolling='no'&gt;&lt;/iframe&gt;"+<br>"&lt;/div&gt;"+<br>"&lt;div id='"+id+"_pad' style='position:absolute;width:100%;height:100%;left:0px;top:0px;'&gt;&lt;/div&gt;"+<br>"&lt;/div&gt;"<br>);<br>menu.board=document.getElementById(id+"_board");<br>menu.pad=document.getElementById(id+"_pad");<br>menu.pad.className=id+"_board";<br>menu.pad.onselectstart=function(){ return false;}<br>}</p>
<p>//增加對像的一個子元素<br>this.crtElement=function(el,p){<br>return p.appendChild(document.createElement(el));<br>}</p>
<p>//安裝菜單;<br>this.setup=function(){<br>menu.crtMenuBoard();<br>menu.crtMenuBar();<br>document.attachEvent("onclick",menu.hideMenu);<br>}</p>
<p>menu.setup();<br>}<br>&lt;/script&gt;<br>&lt;/body&gt;<br>&lt;/html&gt;</p>
<p>&nbsp;</p>
<img src ="http://www.cnitblog.com/yide/aggbug/34998.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.cnitblog.com/yide/" target="_blank">青蛙學堂</a> 2007-10-17 15:20 <a href="http://www.cnitblog.com/yide/archive/2007/10/17/34998.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item><item><title>網頁</title><link>http://www.cnitblog.com/yide/archive/2007/10/14/34842.html</link><dc:creator>青蛙學堂</dc:creator><author>青蛙學堂</author><pubDate>Sun, 14 Oct 2007 07:28:00 GMT</pubDate><guid>http://www.cnitblog.com/yide/archive/2007/10/14/34842.html</guid><wfw:comment>http://www.cnitblog.com/yide/comments/34842.html</wfw:comment><comments>http://www.cnitblog.com/yide/archive/2007/10/14/34842.html#Feedback</comments><slash:comments>0</slash:comments><wfw:commentRss>http://www.cnitblog.com/yide/comments/commentRss/34842.html</wfw:commentRss><trackback:ping>http://www.cnitblog.com/yide/services/trackbacks/34842.html</trackback:ping><description><![CDATA[<p align=center><font size=3>网页代码常用小技巧！<br></font></p>
<p><font size=3>1. oncontextmenu=window.event.returnvalue=false 将彻底屏蔽鼠标右键<br>〈table border oncontextmenu=return(false)〉〈td〉no〈/table〉 可用于Table <br>2. 〈body onselectstart=return false〉 取消选取、防止复制<br>3. onpaste=return false 不准粘贴<br><br>4. oncopy=return false; oncut=return false; 防止复制<br><br>5. 〈link rel=Shortcut Icon href=favicon.ico〉 IE地址栏前换成自己的图标<br><br>6. 〈link rel=Bookmark href=favicon.ico〉 可以在收藏夹中显示出你的图标<br><br>7. 〈input style=ime-mode:-Disabled〉 关闭输入法<br><br>8. 永远都会带着框架 <br>〈script language=javascript〉〈!--<br>if (window == top)top.location.href = frames.htm; //frames.htm为框架网页<br>// --〉〈/script〉<br><br>9. 防止被人frame<br>〈SCRIPT LANGUAGE=javascript〉〈!-- <br>if (top.location != self.location)top.location=self.location;<br>// --〉〈/SCRIPT〉<br><br>10. 网页将不能被另存为<br>〈noscript〉〈iframe src=*.html〉〈/iframe〉〈/noscript〉 <br><br>11. 〈input type=button value=查看网页源代码 <br>onclick=window.location = `view-source:`+ http://www.51js.com/`;〉<br><br>12.删除时确认<br>〈a href=`javascript:if(confirm(确实要删除吗?))location=boos.asp?&amp;areyou=删除&amp;page=1`〉删<br><br>除〈/a〉 <br><br>13. 取得控件的绝对位置<br>//javascript<br>〈script language=javascript〉<br>function getIE(E){<br>var t=e.offsetTop;<br>var l=e.offsetLeft;<br>while(e=e.offsetParent){<br>t+=e.offsetTop;<br>l+=e.offsetLeft;<br>}<br>alert(top=+t+/nleft=+l);<br>}<br>〈/script〉<br><br>//VBScript<br>〈script language=VBScript〉〈!--<br>function getIE()<br>dim t,l,a,b<br>set a=document.all.img1<br>t=document.all.img1.offsetTop<br>l=document.all.img1.offsetLeft<br>while a.tagName〈〉BODY<br>set a = a.offsetParent<br>t=t+a.offsetTop<br>l=l+a.offsetLeft<br>wend<br>msgbox top=&amp;t&amp;chr(13)&amp;left=&amp;l,64,得到控件的位置<br>end function<br>--〉〈/script〉<br><br>14. 光标是停在文本框文字的最后<br>〈script language=javascript〉<br>function cc()<br>{<br>var e = event.srcElement;<br>var r =e.createTextRange();<br>r.moveStart(`character`,e.value.length);<br>r.collapse(true);<br>r.select();<br>}<br>〈/script〉<br>〈input type=text name=text1 value=123 onfocus=cc()〉<br><br>15. 判断上一页的来源<br>javascript:<br>document.referrer<br><br>16. 最小化、最大化、关闭窗口 <br>〈object id=hh1 classid=clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11〉 <br>〈param name=Command value=Minimize〉〈/object〉<br>〈object id=hh2 classid=clsid:ADB880A6-D8FF-11CF-9377-00AA003B7A11〉 <br>〈param name=Command value=Maximize〉〈/object〉<br>〈OBJECT id=hh3 classid=clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11〉<br>〈PARAM NAME=Command value=Close〉〈/OBJECT〉<br><br>〈input type=button value=最小化 onclick=hh1.Click()〉<br>〈input type=button value=最大化 onclick=hh2.Click()〉<br>〈input type=button value=关闭 onclick=hh3.Click()〉<br>本例适用于IE<br><br>17.屏蔽功能键Shift,Alt,Ctrl<br>〈script〉<br>function look(){ <br>if(event.shiftKey) <br>alert(禁止按Shift键!); //可以换成ALT　CTRL<br>} <br>document.onkeydown=look; <br>〈/script〉<br><br>18. 网页不会被缓存<br>〈META HTTP-EQUIV=pragma CONTENT=no-cache〉<br>〈META HTTP-EQUIV=Cache-Control CONTENT=no-cache, must-revalidate〉<br>〈META HTTP-EQUIV=expires CONTENT=Wed, 26 Feb 1997 08:21:57 GMT〉<br>或者〈META HTTP-EQUIV=expires CONTENT=0〉<br><br>19.怎样让表单没有凹凸感？<br>〈input type=text style=border:1 solid #000000〉 <br>或<br>〈input type=text style=border-left:none; border-right:none; border-top:none; border-bottom: <br><br>1 solid #000000〉〈/textarea〉<br><br>20.〈div〉〈span〉&amp;〈layer〉的区别？ <br>〈div〉(division)用来定义大段的页面元素，会产生转行 <br>〈span〉用来定义同一行内的元素，跟〈div〉的唯一区别是不产生转行 <br>〈layer〉是ns的标记，ie不支持，相当于〈div〉<br><br><br>21.让弹出窗口总是在最上面:<br>〈body onblur=this.focus();〉<br><br>22.不要滚动条? <br>让竖条没有: <br>〈body style=`overflow:-Scroll;overflow-y:hidden`〉 <br>〈/body〉 <br>让横条没有: <br>〈body style=`overflow:-Scroll;overflow-x:hidden`〉 <br>〈/body〉 <br>两个都去掉？更简单了 <br>〈body scroll=no〉 <br>〈/body〉 <br><br>23.怎样去掉图片链接点击后，图片周围的虚线？<br>〈a href=# onFocus=this.blur()〉〈img src=logo.jpg border=0〉〈/a〉<br><br>24.电子邮件处理提交表单<br>〈form name=form1 method=post action=mailto:****@***.com enctype=text/plain〉 <br>〈input type=submit〉<br>〈/form〉<br><br>25.在打开的子窗口刷新父窗口的代码里如何写？<br>window.opener.location.reload()<br><br>26.如何设定打开页面的大小<br>〈body onload=top.resizeTo(300,200);〉<br>打开页面的位置〈body onload=top.moveBy(300,200);〉<br><br>27.在页面中如何加入不是满铺的背景图片,拉动页面时背景图不动 <br>〈style〉 <br>body <br>{background-image:url(logo.gif); background-repeat:no-repeat; <br><br>background-position:center;background-attachment: fixed} <br>〈/style〉 <br><br>28. 检查一段字符串是否全由数字组成<br>〈script language=javascript〉〈!--<br>function checkNum(str){return str.match(//D/)==null}<br>alert(checkNum(1232142141))<br>alert(checkNum(123214214a1))<br>// --〉〈/script〉<br><br>29. 获得一个窗口的大小 <br>document.body.clientWidth; document.body.clientHeight<br><br>30. 怎么判断是否是字符<br>if (/[^/x00-/xff]/g.test(s)) alert(含有汉字);<br>else alert(全是字符);<br><br>31.TEXTAREA自适应文字行数的多少<br>〈textarea rows=1 name=s1 cols=27 onpropertychange=this.style.posHeight=this.scrollHeight〉<br>〈/textarea〉<br><br>32. 日期减去天数等于第二个日期<br>〈script language=javascript〉<br>function cc(dd,dadd)<br>{<br>//可以加上错误处理<br>var a = new Date(dd)<br>a = a.valueOf()<br>a = a - dadd * 24 * 60 * 60 * 1000<br>a = new Date(A)<br>alert(a.getFullYear() + 年 + (a.getMonth() + 1) + 月 + a.getDate() + 日)<br>}<br>cc(12/23/2002,2)<br>〈/script〉<br><br>33. 选择了哪一个Radio<br>〈HTML〉〈script language=vbscript〉<br>function checkme()<br>for each ob in radio1<br>if ob.checked then window.alert ob.value<br>next<br>end function<br>〈/script〉〈BODY〉<br>〈INPUT name=radio1 type=radio value=style checked〉style<br>〈INPUT name=radio1 type=radio value=barcode〉Barcode<br>〈INPUT type=button value=check onclick=checkme()〉<br>〈/BODY〉〈/HTML〉<br><br>34.脚本永不出错<br>〈SCRIPT LANGUAGE=javascript〉 <br>〈!-- Hide <br>function killErrors() { <br>return true; <br>} <br>window.onerror = killErrors; <br>// --〉 <br>〈/SCRIPT〉<br><br>35.ENTER键可以让光标移到下一个输入框<br>〈input onkeydown=if(event.keyCode==13)event.keyCode=9〉<br><br>36. 检测某个网站的链接速度：<br>把如下代码加入〈body〉区域中:<br>〈script language=javascript〉<br>tim=1<br>setInterval(tim++,100)<br>b=1<br><br>var autourl=new Array()<br>autourl[1]=http://www.njcatv.net/;<br>autourl[2]=javacool.3322.net<br>autourl[3]=http://www.sina.com.cn/;<br>autourl[4]=http://www.nuaa.edu.cn/;<br>autourl[5]=http://www.cctv.com/;<br><br>function butt(){<br>document.write(〈form name=autof〉)<br>for(var i=1;i〈autourl.length;i++)<br>document.write(〈input type=text name=txt+i+ size=10 value=测试中&#8230;&#8230;〉 =》〈input type=text <br><br>name=url+i+ size=40〉 =》〈input type=button value=GO <br><br>onclick=window.open(this.form.url+i+.value)〉〈br〉)<br>document.write(〈input type=submit value=刷新〉〈/form〉)<br>}<br>butt()<br>function auto(url){<br>document.forms[0][url+b].value=url<br>if(tim〉200)<br>{document.forms[0][txt+b].value=链接超时}<br>else<br>{document.forms[0][txt+b].value=时间+tim/10+秒}<br>b++<br>}<br>function run(){for(var i=1;i〈autourl.length;i++)document.write(〈img <br><br>src=http://+autourl+/+Math.random()+ width=1 height=1 <br><br>onerror=auto(http://;+autourl+`)〉)}<br>run()〈/script〉<br><br>37. 各种样式的光标<br>auto ：标准光标<br>default ：标准箭头<br>hand ：手形光标<br>wait ：等待光标<br>text ：I形光标<br>vertical-text ：水平I形光标<br>no-drop ：不可拖动光标<br>not-allowed ：无效光标<br>help ：?帮助光标<br>all-scroll ：三角方向标<br>move ：移动标<br>crosshair ：十字标<br>e-resize<br>n-resize<br>nw-resize<br>w-resize<br>s-resize<br>se-resize<br>sw-resize<br><br>38.页面进入和退出的特效<br>进入页面〈meta http-equiv=Page-Enter content=revealTrans(duration=x, transition=y)〉<br>推出页面〈meta http-equiv=Page-Exit content=revealTrans(duration=x, transition=y)〉 <br>这个是页面被载入和调出时的一些特效。Duration表示特效的持续时间，以秒为单位。Transition表示使<br><br>用哪种特效，取值为1-23:<br>　　0 矩形缩小 <br>　　1 矩形扩大 <br>　　2 圆形缩小<br>　　3 圆形扩大 <br>　　4 下到上刷新 <br>　　5 上到下刷新<br>　　6 左到右刷新 <br>　　7 右到左刷新 <br>　　8 竖百叶窗<br>　　9 横百叶窗 <br>　　10 错位横百叶窗 <br>　　11 错位竖百叶窗<br>　　12 点扩散 <br>　　13 左右到中间刷新 <br>　　14 中间到左右刷新<br>　　15 中间到上下<br>　　16 上下到中间 <br>　　17 右下到左上<br>　　18 右上到左下 <br>　　19 左上到右下 <br>　　20 左下到右上<br>　　21 横条 <br>　　22 竖条 <br>　　23 以上22种随机选择一种<br><br>39.在规定时间内跳转<br>〈META http-equiv=V=REFRESH content=5;URL=http://www.51js.com〉 <br><br>40.网页是否被检索<br>〈meta name=ROBOTS content=属性值〉<br>　　其中属性值有以下一些:<br>　　属性值为all: 文件将被检索，且页上链接可被查询；<br>　　属性值为none: 文件不被检索，而且不查询页上的链接；<br>　　属性值为index: 文件将被检索；<br>　　属性值为follow: 查询页上的链接；<br>　　属性值为noindex: 文件不检索，但可被查询链接；<br>　　属性值为nofollow: 文件不被检索，但可查询页上的链接。 <br><br>41.变换网页的鼠标光标<br>〈BODY style=CURSOR: url(http://203.73.125.205/~liangmi2/farmfrog01.cur`)〉<br><br>42.怎样实现在任务栏显示小图标的效果？ (要使用绝对地址)<br>有些站点，访问时会在地址栏地址前显出小图标，添加到收藏夹后也在收藏栏中显示图标，<br>这样很好的与其它站点有了区别。 <br>要达到这个效果，先需做出这个图标文件，图像为16*16像素，不要超过16色。文件格式为ico，然后上传至你的网站。<br>然后，在需要的页面中，加上以下html语句到文件的〈head〉和〈/head〉之间（假设以上ico文件的地址http://happyisland.126.com/icon.ico）。<br>〈link REL=SHORTCUT ICONhref=http:〖砺剑〗打了个大揖 笑呵呵地说道：大家好，恭喜发财 ! .island.126.com/icon.ico;〉 <br>如果访问者的浏览器是IE5.0，就不需加任何代码，只要将图标文件上传到网站的根目录下即可。<br>1,META标签里的代码是什么意思？ <br>〈META〉是放于〈HEAD〉与〈/HEAD〉之间的标记.以下是我总结它在网页中最常见的几种。 <br>〈meta name=Keywords content=图片, 新闻, 音乐, 软件〉 <br>该网页的关键字，作用于搜索引擎的登录，事实上它在现在的网站中并没什么用。 <br>〈meta http-equiv=Content-Type content=text/html; charset=gb2312〉 <br>〈meta http-equiv=Content-Type content=text/html; charset=iso-8859-1〉 <br>设定这是 HTML 文件及其编码语系，简体中文网页使用charset=gb2312，繁体中文使用charset=big5，或者不设编码也可，纯英文网页建议使用 iso-8859-1。 <br>〈meta name=GENERATOR content=Microsoft FrontPage 5.0〉 <br>这只表示该网页由什么编辑器写的。 <br>〈meta http-equiv=refresh content=10; url=http://www.hkiwc.com〉 <br>这行较为实用，能于预定秒数内自动转到指定网址。原代码中 10 表示 10秒。 <br><br>2，怎么改变滚动条的颜色，只有ie5.5版本以上才能支持。 <br>这是使用CSS语言，在次说明一下，它和我的浏览器版本有一定的关系。 <br>scrollbar-arrow-color：上下按钮上三角箭头的颜色。 <br>scrollbar-base-color：滚动条的基本颜色。 <br>scrollbar-dark-shadow-color：立体滚动条强阴影的颜色 <br>scrollbar-face-color：立体滚动条凸出部分的颜色 <br>scrollbar-highlight-color：滚动条空白部分的颜色 <br>scrollbar-shadow-color立体滚动条阴影的颜色。<br>scrollbar-track-color:#99CC33;<br>scrollbar-3dlight-color:#A8CBF1; <br>代码如下： <br>〈style〉 <br>〈!-- <br>BODY {<br>scrollbar-face-color:#99CC33;//(立体滚动条凸出部分的颜色) <br>scrollbar-highlight-color:#A8CBF1;//(滚动条空白部分的颜色) <br>scrollbar-shadow-color:#A8CBF1;//(立体滚动条阴影的颜色) <br>scrollbar-arrow-color:#FF9966;//(上下按钮上三角箭头的颜色) <br>scrollbar-base-color:#A8CBF1; //(滚动条的基本颜色) <br>scrollbar-darkshadow-color:#A8CBF1; //(立体滚动条强阴影的颜色)<br>scrollbar-track-color:#99CC33;<br>scrollbar-3dlight-color:#A8CBF1; <br>} <br>--〉 <br>〈/style〉 <br>在这我补充几点： <br>1.让浏览器窗口永远都不出现滚动条。 <br>〈body style=overflow-x:hidden;overflow-y:hidden〉或〈body style=overflow:hidden〉 或〈body scroll=no〉 <br>2，没有水平滚动条 <br>〈body style=overflow-x:hidden〉 <br>3，没有垂直滚动条 <br>〈body style=overflow-y:hidden〉 <br><br><br>3,如何给图片抖动怎做的. <br>〈SCRIPT language=javascript1.2〉 <br>〈!-- <br>var rector=2 <br>var stopit=0 <br>var a=1 <br>var count=0 <br>function init(which){ <br>stopit=0 <br>shake=which <br>shake.style.left=0 <br>shake.style.top=0 <br>} <br>function rattleimage(){ <br>if ((!document.all&amp;&amp;!document.getElementById)||stopit==1||count==100) <br>return <br>count++ <br>if (a==1){ <br>shake.style.top=parseInt(shake.style.top)+rector <br>} <br>else if (a==2){ <br>shake.style.left=parseInt(shake.style.left)+rector <br>} <br>else if (a==3){ <br>shake.style.top=parseInt(shake.style.top)-rector <br>} <br>else{ <br>shake.style.left=parseInt(shake.style.left)-rector <br>} <br>if (a〈4) <br>a++ <br>else <br>a=1 <br>setTimeout(rattleimage(),50) <br>} <br>function stoprattle(which){ <br>stopit=1 <br>count=0 <br>which.style.left=0 <br>which.style.top=0 <br>} <br>//--〉 <br>〈/SCRIPT〉 <br>〈style〉.shakeimage {POSITION: relative} <br>〈/style〉 <br>〈img src=图片的路径 onmouseout=stoprattle(this) onmouseover=init(this);rattleimage() class=shakeimage〉 <br><br>4，在DW如何给水平线加颜色。 <br>在DW中没有此项设置，你只能在HTML中加入代码：〈hr color=red noshade〉按F12的预览在能看到。由于在NC中不支持〈hr〉的COLOR属性，所以在DW中没有此项设置。 <br>　　　 <br>5，如何在网页中实现flash的全屏播放？ <br>只要在调用swf文件的HTML中将WIDTH和HEIGHT的参数设为100％即可，当然也可以在Flash导出HTML文件的设置中进行设置，方法是：打开File菜单；选Publish Settings弹出导出设置对话框；在HTML标签下的Dimensions选项,下拉后选中Percent（百分比）,并在WIDTH 和HEIGHT框中填100.就行了。 <br><br>6,为什么我在DW中插入的Flash动画缺看不找！ <br>如果你没有正确地安装Dreamweaver和Flash，那么在你预览的时候，Dreamweaver会提示你缺少播放的插件，请你按装InstallAXFlash.exe 并从新启动计算机。现在IE6已经捆绑这个程序。 <br><br>7，在Flash中，如果屏蔽鼠标右键?FS命令都是什么意思? <br>fscommand (fullscreen, true/false);（全屏设置，TRUE开，FALSE关） <br>fscommand (showmenu, true/false);（右键菜单设置，TRUE显示，FALSE不显示） <br>fscommand (allowscale, true/false);（缩放设置，TRUE自由缩放，FALSE调整画面不影响影片本身的尺寸） <br>fscommand (trapallkeys, true/false);（快捷键设置，TRUE快捷键开，FALSE快捷键关） <br>fscommand (exec);（EXE程序调用） <br>fscommand (quit);（退出关闭窗口） <br><br>8，Flash中什么是隐形按钮。 <br>利用button中的hit帧来制作只有感应区域而完全透明的按钮。 <br><br>9，如何给Flash动画做链接。 <br>Dreamweaver是不能给Flash制作链接的，只能在Flash中用geturl()加链接，然后再插入Dreamweaver中。 <br><br>10，DW中的层的技巧。 <br>层是可以嵌套的，我个人给大家一个技巧，在层面板中按住CTRL再拖放层到你想去成为其子层的地方就行了，我认为这是最简单直观的方法了。 <br><br>11，如何改变鼠标的形状？ <br>在Dreamweaver4中CSS样式面板： <br>按CTR+SHIFT+E--出现样式表对话框,点击NEW，出现编辑对话框,在左边最后一项extensions-cursor 选择你要改的指针形式就可以了，然后把你要想改变的地方运用样式表，如果整页都有在〈body bgcolor=#003063 text=#ffffff id=all〉中加入就行了。 <br>〈span style=cursor:X`〉样例〈/span〉 <br>这里选择（文本）作为对象，还可以自己改为其他的，如link等。 <br>x可以等于=hand（手形）、crosshair（十字）、text（文本光标）、wait（顾名思义啦）、default（默认效果）、help（问号）、e-size（向右箭头）、ne-resize（向右上的箭头）、nw-resize（向左上的箭头）、w-resize（向左的箭头）、sw-resize（左下箭头）、s-resize（向下箭头）、se-resize（向右下箭头）、auto（系统自动给出效果）。 <br><br>12，用CSS做邮票，看看吧！ <br>〈input type=button value=我象不象邮票？ style=height:80px;border:2px dashed #cccccc〉 <br><br><br>13，经常上网的朋友可能会到过这样一些网站，一进入首页立刻会弹出一个窗口，怎么做呢！ <br>这javascript代码即可实现，摘录蓝色论坛。 <br>【1、最基本的弹出窗口代码】 <br>其实代码非常简单： <br>〈SCRIPT LANGUAGE=javascript〉 <br>〈!-- <br>window.open (`page.html`) <br>--〉 <br>〈/SCRIPT〉 <br>因为着是一段javascripts代码，所以它们应该放?lt;SCRIPT LANGUAGE=javascript〉标签和〈/script〉之间。〈!-- 和 --〉是对一些版本低的浏览器起作用，在这些老浏览器中不会将标签中的代码作为文本显示出来。要养成这个好习惯啊。 <br>window.open (`page.html`) 用于控制弹出新的窗口page.html，如果page.html不与主窗口在同一路径下，前面应写明路径，绝对路径(http://)和相对路径(../)均可。用单引号和双引号都可以，只是不要混用。 <br>这一段代码可以加入HTML的任意位置，〈head〉和〈/head〉之间可以，〈body bgcolor=#003063 text=#ffffff id=all〉间〈/body〉也可以，越前越早执行，尤其是页面代码长，又想使页面早点弹出就尽量往前放。 <br>【2、经过设置后的弹出窗口】 <br>下面再说一说弹出窗口的设置。只要再往上面的代码中加一点东西就可以了。 <br>我们来定制这个弹出的窗口的外观，尺寸大小，弹出的位置以适应该页面的具体情况。 <br>〈SCRIPT LANGUAGE=javascript〉 <br>〈!-- <br>window.open (`page.html`, `newwindow`, `height=100, width=400, top=0,left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no`) <br>//写成一行 <br>--〉 <br>〈/SCRIPT〉 <br>参数解释： <br>〈SCRIPT LANGUAGE=javascript〉 js脚本开始； <br>window.open 弹出新窗口的命令； <br>`page.html` 弹出窗口的文件名； <br>`newwindow` 弹出窗口的名字（不是文件名），非必须，可用空``代替； <br>height=100 窗口高度； <br>width=400 窗口宽度； <br>top=0 窗口距离屏幕上方的象素值； <br>left=0 窗口距离屏幕左侧的象素值； <br>toolbar=no 是否显示工具栏，yes为显示； <br>menubar，scrollbars 表示菜单栏和滚动栏。 <br>resizable=no 是否允许改变窗口大小，yes为允许； <br>location=no 是否显示地址栏，yes为允许； <br>status=no 是否显示状态栏内的信息（通常是文件已经打开），yes为允许； <br>〈/SCRIPT〉 js脚本结束 <br>【3、用函数控制弹出窗口】 <br>下面是一个完整的代码。 <br>〈html〉 <br>〈head〉 <br>〈script LANGUAGE=javascript〉 <br>〈!-- <br>function openwin() { window.open (page.html, newwindow, height=100, width=400, toolbar= <br>no, menubar=no, scrollbars=no, resizable=no, location=no, status=no) <br>//写成一行 <br>} <br>//--〉 <br>〈/script〉 <br>〈/head〉 <br>〈body onload=openwin()〉 <br>&#8230;任意的页面内容&#8230; <br>〈/body〉 <br>〈/html〉 <br>这里定义了一个函数openwin(),函数内容就是打开一个窗口。在调用它之前没有任何用途。 <br>怎么调用呢？ <br>方法一：〈body onload=openwin()〉 浏览器读页面时弹出窗口； <br>方法二：〈body onunload=openwin()〉 浏览器离开页面时弹出窗口； <br>方法三：用一个连接调用： <br>〈a href=# onclick=openwin()〉打开一个窗口〈/a〉 <br>注意：使用的&#8220;#&#8221;是虚连接。 <br>方法四：用一个按钮调用： <br>〈input type=button onclick=openwin() value=打开窗口〉 <br><br><br>14，没有用表格写的，让大家随便看看，没什么。 <br>〈html〉 <br>〈head〉 <br>〈title〉江南荷花扇面〈/title〉 <br>〈meta http-equiv=Content-Type content=text/html; charset=gb2312〉 <br>〈style type=text/css〉 <br>〈!-- <br>.font1 { font-size: 12px; color: #999999; text-decoration: none} <br>a { font-size: 12px; color: #999999; text-decoration: none} <br>a:hover { font-size: 12px; color: #000000; text-decoration: none} <br>--〉 <br>〈/style〉 <br>〈/head〉 <br>〈body bgcolor=#FFFFFF text=#000000〉 <br>〈div class=font1 style=writing-mode=tb-rl;height:200px width=300〉 <br>〈p〉盛夏　　　　　　尚　涛　 <br>〈p〉〈a href=index.htm〉一夜露痕黄粉香　袁运甫 〈/a〉 <br>〈p〉瑶池昨夜新凉　　王金岭 <br>〈p〉一朵白莲随意开　吴冠南 <br>〈p〉新雨迎秋欲满塘　齐辛民 <br>〈p〉十里荷香　　　　齐辛民 <br>〈p〉濯清莲而不妖　　卢世曙 <br>〈/div〉 <br>〈/body〉 <br>〈/html〉 <br><br><br>15,IE6已支持自定义cursor! <br>语法格式 cursor:url(图标) //cur或是ani文件. <br>cur就是WINDOWS中的光标(cursor)文件，光标文件与图标（ICON)文件除了文件头有一个位置的值不同外，实际是一样的。 <br>ani是WINDOWS中的动画光标（图标）文件。 <br>〈style type=text/css〉 <br>〈!-- <br>.unnamed1 { cursor:url(arrow2c.cur)} <br>--〉 <br>〈/style〉 <br><br>16,用marquee做的滚动字幕.这也我刚看到论坛的朋友在问。 <br>语法： <br>align=# | top | middle| bottom //对齐方式) <br>BEHAVIOR=ALTERNATE | SCROLL | SLIDE //移动的方式 <br>BGCOLOR=color//底色区域颜色 <br>DIRECTION=DOWN | LEFT | RIGHT | UP //移动的方向 <br>Loop=n //循环次数（默认是循环不止） <br>Scrolldelay=milliseconds//延时 <br>height=# width=# //区域面积 <br>hspace=# vspace=# //空白区域 <br>scrollamount=# //移动的速度 <br>〈marquee align=top behavior=ALTERNATE BGCOLOR=#000000 height=60 width=433 scrollamount=5〉〈/marquee〉<br><br>17，在FLASH5中也存在一些字体，打散后变成一团的事是为什么？有解决的办法吗。 <br>这是大家很常见的问题！可能是对字库支持的不好！我个是做成透明的gif图片格式，然后倒入。 <br><br>18，flash的网页里&#8220;加入收藏夹&#8221;功能怎么实现？ <br>在as中加getUrl(java script:window.external.addFavorite(http://skydesigner.51.net`,`我的工作室`)) <br><br>19，在Flash中，文本的动态属性和输入属性的区别。 <br>input text在运行时可被用户或程序改变其值。 <br>ynamic text仅允许被程序修改。 <br><br><br>20,怎样在IE中调用Dreamweaver进行编辑. <br>相信很多在使用WinME或Window2000的朋友，会遇见是个问题。很简单，把我们笔记本程序打开，保存为一个 *.reg 文件。双击它将信息添加到注册表即可。 <br>REGEDIT4 <br>[HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver] <br>[HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell] <br>[HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell\edit] <br>[HKEY_CLASSES_ROOT\.htm\OpenWithList\Dreamweaver\shell\edit\command] <br>@=\c:\\Program Files\\Macromedia\\Dreamweaver 4\\dreamweaver.exe\ \%1\ <br><br>21，设置表格虚线。 <br>方法一：作一个1X2的图。半黑半白，再利用表格作成线。 <br>方法二：在css里面设，要IE5。5才支持这种效果。 <br>style=BORDER-LEFT: #000000 1PX DASHED; BORDER-RIGHT: #000000 1PX DASHED; BORDER-TOP: #000000 1PX DASHED; BORDER-BOTTOM: #000000 1PX DASHED <br><br>22,看看在网页中调用HHCtrl控件效果。 <br>代码如下： <br>〈object id=HHC type=application/x-oleobject classid=clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11〉〈/object〉〈script〉HHC.TextPopup(哈哈,大家好,我是闪梦!,,50,5,128255,346751);〈/script〉 <br><br><br>22，如何让一张图片有浅到深的渐变。 <br>〈SCRIPT language=javascript1.2〉 <br>〈!-- <br>function high(which2){ <br>theobject=which2 <br>highlighting=setInterval(highlightit(theobject),50) <br>} <br>function low(which2){ <br>clearInterval(highlighting) <br>which2.filters.alpha.opacity=40 <br>} <br>function highlightit(cur2){ <br>if (cur2.filters.alpha.opacity〈100) <br>cur2.filters.alpha.opacity+=10 <br>else if (window.highlighting) <br>clearInterval(highlighting) <br>} <br>〈/script〉 <br>〈img onmouseout=low(this) onmouseover=high(this) style=FILTER: alpha(opacity=40)src=logo.gif 〉 <br><br>23,双击鼠标左键来滚动背景，单击停止。 <br>〈SCRIPT language=javascript〉 <br>var currentpos,timer; <br>function initialize() <br>{ <br>timer=setInterval(scrollwindow(),16); <br>} <br>function sc(){ <br>clearInterval(timer); <br>} <br>function scrollwindow() <br>{ <br>currentpos=document.body.scrollTop; <br>window.scroll(0,++currentpos); <br>if (currentpos != document.body.scrollTop) <br>sc(); <br>} <br>document.onmousedown=sc <br>document.ondblclick=initialize <br>〈/SCRIPT〉 <br><br>24,如何在同一页面设置不同文字链接效果的样式. <br>代码如下： <br>〈HTML〉〈HEAD〉〈TITLE〉如何在同一页面设置不同文字链接效果的样式〈/TITLE〉 <br>〈meta http-equiv=Content-Type content=text/html; charset=gb2312〉 <br>〈style type=text/css〉 <br>〈!-- <br>a:hover { font-size: 9pt; color: #FF0000; text-decoration: underline} <br>a:link { font-size: 9pt; color: #006699; text-decoration: underline} <br>a:visited { font-size: 9pt; color: #006699; text-decoration: underline} <br>a:active { font-size: 9pt; color: #FF0000; text-decoration: none} <br>a.r1:hover { font-size: 9pt; color: #FF0000; text-decoration: underline overline} <br>a.r1:link { font-size: 9pt; color: #000000; text-decoration: underline overline} <br>a.r1:visited { font-size: 9pt; color: #99CC00; text-decoration: underline overline} <br>a.r1:active { font-size: 9pt; color: #000000; text-decoration: underline overline} <br>--〉 <br>〈/style〉 <br>〈/head〉 <br>〈body bgcolor=#FFFFFF text=#000000〉 <br>〈a href=#〉下划线链接 〈/a〉 <br>〈p〉〈/p〉 <br>〈a href=# class=r1〉双下划线链接〈/a〉 <br>〈/BODY〉 <br>〈/HTML〉 <br>补充说明： <br>a:hover 表示鼠标划过时的样式. <br>a:link 表示链接的样式. <br>a:active 表示当前活动连接的样式. <br>a:visited 表示已经访问过的连接的样式. <br><br>25, 用CSS给文字加入阴影效果和文字描边效果。 <br>.glow{FONT-SIZE: 9pt; FILTER: Glow(Color=#000000, Strength=1)} <br>//文字描边效果 <br>.shadow {FONT-SIZE: 9pt; FILTER: DropShadow(OffX=1, OffY=1, DropShadow(OffX=1, OffY=1, color:#111111); COLOR: #ffffff; FONT-FAMILY: 宋体} <br>//加入阴影效果 <br>补充说明： <br>　　这两种滤镜要想实现效果，必须加在如：〈td class=glow或shadow 〉〈div〉xxxxxxxxx〈/div〉〈/td〉上 <br>，并且要留有足够的空间能够显示阴影或描边，否则会出现半截的阴影或描边现象。 <br><br>26,如何给做带颜色的下拉菜单。 <br>〈select style=FONT-SIZE: 10px; COLOR: #ffffff; FONT-FAMILY: Verdana;BACKGROUND-COLOR: #ff6600; size=1 〉 <br>〈option selected〉:: Dreamweaver4 ::〈/option〉 <br>〈option〉::Flash5::〈/option〉 <br>〈option〉::Firewoks4::〈/option〉 <br>〈/select〉 <br><br>27,关于DW4的表格中的亮边框和暗边框问题。 <br>在DW4的表格面板中并没有亮边框和暗边框的属性设置，因为NC不支持,只有你在代码中添加了。 <br>bordercolorlight=#999999 bordercolordark=#000000 <br>　　你也可以用Css定义一个class。例如： <br>〈style〉 <br>.bordercolor { bordercolorlight: #999999; bordercolordark: #000000 } <br>〈/style〉 <br>　　然后在要加效果的表格里加?lt;table class=bordercolor〉 <br><br>28,自动显示主页最后更新日期. <br>〈script〉 <br>document.write(最后更新日期：+document.lastModified+) <br>〈/script〉 <br><br>29,如何让滚动条出现在左边？ <br>我想居然在论坛中有人发表了这段代码，很有意思，它的确照顾一些左撇子，呵呵！ <br>〈html dir=rtl〉 <br>〈body bgcolor=#000000 text=#FFFFFF〉 <br>〈table height=18 width=212 align=center bgcolor=#FFFFFF dir=ltr cellspacing=1 　cellpadding=0〉 <br>〈tr〉 <br>〈td bgcolor=#FF0000 〉是不是你的滚动条在左边啊〈/td〉 <br>〈/tr〉 <br>〈/table〉 <br>〈/body〉 <br>〈/html〉 <br><br>30,如何加入网址前面的小图标？ <br>　　首先,您必须了解所谓的图标（Icon）是一种特殊的图形文件格式，它是以 .ico 作为扩展名。你可用在网上找一个制作图标软件，它具有特有的规格：图标的大小为 16 * 16（以像素为单位）；颜色不得超过 16 色。 在该网页文件的 HEAD 部分加入下面的内容：〈LINK REL=SHORTCUT ICON HREF= http://skydesigner.51.net/图标文件名〉,并放在该网页的根目录下。 <br><br>31,在800*600显示器中，如何不让网页水平出现滚动条！ <br>设至〈body leftmargin=0 topmargin=0〉，网页中的表格宽度为778。 <br><br>32,关于〈!DOTYPE〉的说明解释。 <br>在网页中，经常会看到〈!DOCTYPE HTML PUBLIC`-//W3C//DTD HTML 4.01//EN`〉，是声明HTML文件的版本信息。 <br><br>33, 用图片来关闭窗体. <br>〈A href=java script:window.close()〉〈IMG height=20 width=20 alt=关闭窗口 src=close.gif border=0〉〈/A〉 <br>补充说明：如何使用了ACTIVEX！,不再警告窗口？ <br>〈html〉 <br>〈head〉 <br>〈object id=closes type=application/x-oleobject <br>classid=clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11〉 <br>〈param name=Command value=Close〉〈/object〉 <br>〈/head〉 <br>〈body bgcolor=#003063 text=#ffffff id=all〉 〈a href=# onclick=closes.Click();〉关闭窗口无提示〈/a〉 <br>〈/body〉 <br>〈/html〉 <br><br>34,禁止鼠标右键查看网页源代码。 <br>〈SCRIPT language=javascript〉 <br>function click() <br>{if (event.button==2) {alert(`你好,欢迎光临！`) }} <br>document.onmousedown=click <br>〈/SCRIPT〉 <br>补充说明： <br>鼠标完全被封锁,可以屏蔽鼠标右键和网页文字。 <br>〈 body oncontextmenu=return false ondragstart=return false onselectstart=return false〉 <br><br>35,通过按钮来查看网页源代码。 <br>〈input type=BUTTON value=查看源代码 onClick= `window.location = view-source: + window.location.href` name=BUTTON〉 <br><br>36,怎么用文字联结实现按钮的SUBMIT功能？ <br>〈a href=# onclick=formname.submit()〉OK〈/a〉 <br>这段文字要放在form里。formname是这里要写在form中的name,〈form name=form111〉那么就应该是form111.submit() <br><br>37,如何做一个空链接？ <br>加# <br><br>38,利用〈IFRAME〉来给网页中插入网页。 <br>　　经常我看到很多网页中又有一个网页，还以为是用了框架，其实不然，是用了〈IFRAME〉,它只适用于IE，NS可是不支持〈IFRAME〉的，但围着的字句只有在浏览器不支援 iframe 标记时才会显示，如〈noframes〉一样，可以放些提醒字句之类的话。 <br>你注意啊！下面请和我学习它的用法。 <br>分析代码：〈iframe src=iframe.html name=test align=MIDDLE width=300 height=100 marginwidth=1 marginheight=1 frameborder=1 scrolling=Yes〉 〈/iframe〉<br>　　src=iframe.html <br>　　用来显示〈IFRAME〉中的网页来源，必要加上相对或绝对路径。 <br>　　name=test <br>　　这是连结标记的 target 参数所需要的。 <br>　　align=MIDDLE <br>　　可选值为 left, right, top, middle, bottom，作用不大 。 <br>　　width=300 height=100 <br>　　框窗的宽及长，以 pixels 为单位。 <br>　　marginwidth=1 marginheight=1 <br>　　该插入的文件与框边所保留的空间。 <br>　　frameborder=1 <br>　　使用 1 表示显示边框， 0 则不显示。（可以是 yes 或 no） <br>　　scrolling=Yes <br>　　使用 Yes 表示容许卷动（内定）， No 则不容许卷动。 <br><br>39,请问＜tbody＞的用法？ <br>tbody用法据说是加强对表格的控制能力的.例如： <br>　〈table〉〈tbody〉&#8230;&#8230;..〈/tbody〉〈/table〉 <br>　　tbody代码如果不是你用手写的话,只有在你用IE5打开一个网页的时候， 把它另存为 <br>一下，你的另存为的文件在表格中就会生成tbody代码。(即便你的表格根本就没有 <br>tbody代码，IE5另存为的时候也会给你生成)。 <br><br>40,Alt和Title都是提示性语言标签，请注意它们之间的区别。 <br>　　在我们浏览网页时，当鼠标停留在图片对象或文字链接上时，在鼠标的右下角有时会出现一个提示信息框。对目标进行一定的注释说明。在一些场合，它的作用是很重要的。 <br>alt 用来给图片来提示的。Title用来给链接文字或普通文字提示的。 <br>用法如下： <br>　　　〈p Title=给链接文字提示〉文字〈/p〉 <br>　　　〈a href=# Title=给链接文字提示〉文字〈/a〉 <br>　　　〈img src=图片.gif alt=给图片提示〉 <br>补充知识：〈TITLE〉〈ALT〉里面如何多行换行？在源代码里Enter回车。 <br>〈a href=# Title=个人简历 <br>姓名：张培 <br>网名：我是闪梦 <br>性别：男的，不是女的。 <br>爱好：网页制作，软件开发〉个人简历〈/a〉 <br>例如：个人简历 <br><br>41, 用javascript代码来实现闪烁按钮。 <br>〈body〉 <br>〈form method=POST action=--WEBBOT-SELF--〉 <br>〈input type=button name=SUB value=闪烁 id=flashit style=BORDER: 1px solid ;BACKGROUND-COLOR: #FFFFFF〉 <br>〈/form〉 <br>〈script〉 <br>if (document.all&amp;&amp;document.all.flashit) <br>{ <br>var flashelement=document.all.flashit <br>if (flashelement.length==null) <br>flashelement[0]=document.all.flashit <br>function changecolor(which) <br>{ <br>if (flashelement[which].style.color==`#800000`) <br>flashelement[which].style.color=#0063A4 <br>else <br>flashelement[which].style.color=#800000 <br>} <br>if (flashelement.length==null) <br>setInterval(changecolor(0),1000) <br>else <br>for (i=0;i〈flashelement.length;i++) <br>{ <br>var tempvariable=`setInterval(changecolor(`+i+`),`+`1000)` <br>eval(tempvariable) <br>} <br>} <br>〈/script〉 <br>〈/body〉 <br><br>42,CSS给图片定义颜色边框。 <br>img { border: 1px solid red} <br><br>43,在DW中如何使插入的FLASH透明。 <br>方法一：选中swf,打开原代码窗口，在〈/object〉前输入:〈param name=wmode value=transparent〉 <br>方法二：在Flash中的Flie&#8594;Publist Settings&#8594;HTML&#8594;Window Mode选择transparent <br><br>44,在DW编辑文本中，如何输入一个空格呢？ <br>输入空格的问题，在DW似乎已成了一个老生常谈的问题。通过将输入法调整到全角模式就可以避免了。本以人工智能ABC为例.按Shift+Space切换到全角状态。 <br><br>45,为何我的DW中图形显示不正常。 <br>第一种：可能是因为你定义并正在使用一个site，而你的HTML文件或者图片不在这个site包含的区域之内，因此dreamweaver使用file协议来 <br>描述图象的绝对路径，可惜IE不支持src中使用file协议，所以图象就显示不出来了。 <br>第二种：可能是放图片的文件夹或图片名为中文，也显示不到网页中去。 <br><br>46,如何在本地机器上测试flash影片的loading？ <br>我想这可能是很多人在问的题了，其实很简单，在Test时，选选View-〉Show Streaming就可以看到了。 <br><br>47,在网页中做出一根竖的线有几种办法. <br>第一种方法：用一个像素图的办法！ <br>如果你用Dreamwever的Edit&#8594;Preferences&#8230;&#8594;Layout View中的Spacer Image给你创建了一个缺省名为：spacer.gif的一个像素图文件 。 <br>代码中： <br>〈table border=0 cellspacing=0 cellpadding=0〉 <br>〈tr〉 <br>〈td bgcolor=#FF0000 height=200 〉〈img src=spacer.gif width=1 height=1〉〈/td〉 <br>〈/tr〉 <br>〈/table〉 <br>第二种方法：用表格填颜色的办法！把〈td〉 〈/td〉中的 删掉 . <br>〈table border=0 cellspacing=0 cellpadding=0〉 <br>〈tr〉 <br>〈td bgcolor=#FF0000 height=200 width=1〉〈/td〉 <br>〈/tr〉 <br>〈/table〉 <br>第三种方法：用水平条。 <br>〈hr color=red width=1 size=100%〉 <br><br>48, 关于鼠标拖动,改变层大小。──看看微软的做法. <br>〈script〉 <br>document.execCommand(2D-position,false,true); <br>〈/script〉 <br>〈DIV contentEditable=true〉 <br>〈DIV style=WIDTH: 300px; POSITION: absolute; HEIGHT: 100px; BACKGROUND-COLOR: red〉移动层〈/DIV〉 <br>〈/DIV〉 <br><br>49 ,点击连接文字加入收藏夹。 <br>〈a href=java script:window.external.AddFavorite(http://www.263.net`, `269家园`)〉点击加入收藏夹〈/a〉 </font></p>
<font size=3>&nbsp;</font> 
<img src ="http://www.cnitblog.com/yide/aggbug/34842.html" width = "1" height = "1" /><br><br><div align=right><a style="text-decoration:none;" href="http://www.cnitblog.com/yide/" target="_blank">青蛙學堂</a> 2007-10-14 15:28 <a href="http://www.cnitblog.com/yide/archive/2007/10/14/34842.html#Feedback" target="_blank" style="text-decoration:none;">发表评论</a></div>]]></description></item></channel></rss>