firefox only,no ie,no opera

</p> <style type="text/css"> <p>div {</p> <p>border: 8px solid #000;</p> <p>-moz-border-bottom-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;</p> <p>-moz-border-top-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;</p> <p>-moz-border-left-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;</p> <p>-moz-border-right-colors: #555 #666 #777 #888 #999 #aaa #bbb #ccc;</p> <p>padding: 5px;</p> <p>}</p> </style> <div>2131</div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

firefox only

</p> <style type="text/css"> <p>div {</p> <p>border:solid 1px red;</p> <p>width:100px;</p> <p>height:100px;</p> <p>-moz-border-radius-topleft:10px blue;</p> <p>-moz-border-radius-topright:5px;</p> <p>-moz-border-radius-bottomleft:30px;</p> <p>-moz-border-radius-bottomright:15px;</p> <p>}</p> </style> <div>2131</div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

firefox 支持 background-origin，可惜还需要 -moz- 的写法，直接写css3还是不行，至少 firefox(20070309 Firefox/2.0.0.3)如此。

background-origin，默认背景从 padding 开始计算。background-origin:border 从表框就开始计算；background-origin:content 从内容部分开始计算

</p> <style type="text/css"> <p>div {width:100px;height:100px;background-image:url(images/grid10.png);margin-top:5px;}</p> <p>div.example1 {</p> <p>border:solid 5px #000;</p> <p>background-position:;</p> <p>background-origin:;</p> <p>}</p> <p>div.example2 {</p> <p>border:solid 5px #000;</p> <p>background-origin:border;</p> <p>-moz-background-origin:border;</p> <p>background-clip:padding;</p> <p>}</p> <p>div.example3 {</p> <p>border:solid 5px #000;</p> <p>padding:3px;</p> <p>background-origin:content;</p> <p>-moz-background-origin:content;</p> <p>background-clip:padding;</p> <p>}</p> </style> <div class="example1"></div> <div class="example2"></div> <div class="example3">11</div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

更多参考资料：

CSS3: background-origin and background-clip

这个 Find Toolbar Tweaks 就是给 firefox 的 ctrl+f 搜索栏删改了一些功能。

1. Move the close button on the right-side end

You can select position from 4 options. Right, Center (after labels displayed), Left (Firefox default), and hide it.

2. Close Toolbar by double click

No need to explain, I guess.

3. Hide “Match case” check box

This option is not so useful in Japanese (non-ASCII) environment.

4. When wrapped, change the color of input box

When the search reaches the last (or top) of page, color of input box changes to yellow.

5. Add a context menu

From the context menu, you can open a setting window. You also can close Find Toolbar from here.

6. Hide button labels

You can hide the labels of these buttons; Find next, Find previous, Highlight all.

7. Clear button

Clear text of the input box. Borrowed from Findbar Basics by CatThief.

8. Show buttons on Quick Find Bar

You can use the same buttons as normal search bar on Quick Find bar.

9. Close Toolbar by page click

You can disable this behavior via setting window for normal search mode. Please note that this setting dose not affect to FAYT mode.

10. “Previous Word” button

Input previous seach word on the last session. If you are using FAYT mode, it might be useful when you accidentally closed find toolbar, or when you want to seach multiple tabs with the same word.

11. Auto “Highlight All”

Automatically “Highlight All” as you type letters. Default setting is 3 letters, that is, if you type 3 or more letters, “Highlight All” will be evoked without pushing button. You can change the number of letters from 2, 3, 4 letters on Options window.

据说还将要加入正则功能，我看大可不必，毕竟只是一个页面内的搜索，：）即将加入的功能如下：

1. Implement 0.9.4 features dropped from 1.0.

2. Add option to show/hide the label of status message when wrap.

3. “Whole word search” support.

4. Regular expression support.

对原来的 blog 调色板代码 做了一点改进。firefox 默认返回的是 rgb(xx,xx,xx) 的格式。虽然所有浏览器渲染前实际上都是都是先转换成这样的 rgb格式，但毕竟记忆不方便啊。

</p> <p><script></p> <p>function rgbToHex(aa)</p> <p>{</p> <p>//aa="rgb(17,68,170)";</p> <p>aa=aa.replace("rgb(","")</p> <p>aa=aa.replace(")","")</p> <p>aa=aa.split(",")</p> <p>r=parseInt(aa[0]);</p> <p>g=parseInt(aa[1]);</p> <p>b=parseInt(aa[2]);</p> <p>//alert(r+”|”+g+”|”+b)</p> <p>r = r.toString(16);</p> <p>if (r.length == 1)</p> <p>{</p> <p>r = ‘0′ + r;</p> <p>}</p> <p>g = g.toString(16);</p> <p>if (g.length == 1)</p> <p>{</p> <p>g = ‘0′ + g;</p> <p>}</p> <p>b = b.toString(16);</p> <p>if (b.length == 1)</p> <p>{</p> <p>b = ‘0′ + b;</p> <p>}</p> <p>return (”#” + r + g + b).toUpperCase();</p> <p>}</p> <p></script></p> <div style="background-color: #14a" onclick="if(this.style.backgroundColor.indexOf('rgb')!=-1){alert(rgbToHex(this.style.backgroundColor));}else{alert(this.style.backgroundColor)}">111 </div> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

看到这个老问题，ie 下button会被清掉，导致错误。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> </p> <p> <html> </p> <p> <head> </p> <p> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> </p> <p> </head> </p> <p> <body> </p> <input type="button" name="Button" value="Button" onclick="javascript:document.write('123');alert('');document.write('456');document.close();"> <p> </body> </p> <p> </html> </p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

为什么代码“alert(”);”被执行了，而“document.write(’456′);”没被执行？

我觉得qazwsx_feng 的解释有点道理

以下为引用内容:

---

alert();是window的方法！

write是document的方法，

button按下后window.document已经不是最初的document而是提交后的document

而由于window对象仍然是最初的window对象它的方法仍可执行。

---

下面的代码在ie和firefox的表现也不一样

</p> <p><body></p> <p></body></p> <p><script></p> <p>window.document.write("111111111")</p> <p>alert(1)</p> <p>document.write("22222222222222222")</p> <p>alert(document.body.innerHTML)</p> <p>document.write("333333333333")</p> <p></script></p> <p> [Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

有点头昏了，谁有更好的解释