语源科技BlogJava-wz5270

请不要做浮躁的人（转自叶枫）

尨奇 — Sun, 08 Apr 2007 01:44:00 GMT

请不要做浮躁的人
1.不要看到别人的回复第一句话就说：给个代码吧！你应该想想为什么。当你自己想
出来再参考别人的提示，你就知道自己和别人思路的差异。
2.初学者请不要看太多太多的书那会误人子弟的，先找本系统的学，很多人用了很久
都是只对部分功能熟悉而已，不系统还是不够的。
3.看帮助,不要因为很难而自己是初学者所以就不看；帮助永远是最好的参考手册，
虽然帮助的文字有时候很难看懂，总觉得不够直观。
4.不要被对象、属性、方法等词汇所迷惑；最根本的是先了解最基础知识。
5.不要放过任何一个看上去很简单的小问题--他们往往并不那么简单，或者可以引伸
出很多知识点；不会举一反三你就永远学不会。
6.知道一点东西，并不能说明你会写脚本，脚本是需要经验积累的。
7.学脚本并不难，JSP、ASP、PHP等等也不过如此--难的是长期坚持实践和不遗余力的博览
群书；
8.看再多的书是学不全脚本的，要多实践
9.把时髦的技术挂在嘴边，还不如把过时的技术记在心里；
10.学习脚本最好的方法之一就是多练习；
11.在任何时刻都不要认为自己手中的书已经足够了；
12.看得懂的书，请仔细看；看不懂的书，请硬着头皮看；

13.别指望看第一遍书就能记住和掌握什么——请看第二遍、第三遍；
14.请把书上的例子亲手到电脑上实践，即使配套光盘中有源文件；
15.把在书中看到的有意义的例子扩充；并将其切实的运用到自己的工作中；
16.不要漏掉书中任何一个练习——请全部做完并记录下思路；
17.当你用脚本到一半却发现自己用的方法很拙劣时，请不要马上停手；请尽快将余
下的部分粗略的完成以保证这个代码的完整性，然后分析自己的错误并重新编写和工
作。
18.别心急，写脚本确实不容易；水平是在不断的实践中完善和发展的；
19.每学到一个脚本难点的时候，尝试着对别人讲解这个知识点并让他理解----你能
讲清楚才说明你真的理解了；
20.记录下在和别人交流时发现的自己忽视或不理解的知识点；
21.保存好你做过的所有的源文件----那是你最好的积累之一；
22.对于网络，还是希望大家能多利用一下，很多问题不是非要到论坛来问的，首先
你要学会自己找答案，比如google、百度都是很好的搜索引擎，你只要输入关键字就
能找到很多相关资料，别老是等待别人给你希望，看的出你平时一定也很懒！
23，到一个论坛，你学会去看以前的帖子，不要什么都不看就发帖子问，也许你的问
题早就有人问过了，你再问，别人已经不想再重复了，做为初学者，谁也不希望自己
的帖子没人回的。
24，虽然不是打击初学者，但是这句话还是要说：论坛论坛，就是大家讨论的地方，
如果你总期望有高手总无偿指点你，除非他是你亲戚！！讨论者，起码是水平相当的
才有讨论的说法，如果水平真差距太远了，连基本操作都需要别人给解答，谁还跟你
讨论呢。

浮躁的人容易问：我到底该学什么；----别问，学就对了；
浮躁的人容易问：Js有钱途吗；----建议你去抢银行；
浮躁的人容易说：我要中文版！我英文不行！----不行？学呀！
浮躁的人分两种：只观望而不学的人；只学而不坚持的人；
浮躁的人永远不是一个高手。

尨奇 2007-04-08 09:44 发表评论

BACKGROUND IMAGES AND IMAGE REPLACEMENT

尨奇 — Tue, 03 Apr 2007 06:44:00 GMT

在这章我们将学习到：

1.Fixed- and flexible-width rounded-corner boxes
2.The sliding doors technique
3.Mountaintop corners
4.CSS drop shadows
5.PNG transparency support for Internet Explorer 5.x and above
6.Image replacement

基本的背景图片

body {
background:url(pattern.gif);
}

body {
background: #ccc url(gradient.gif) repeat-x;
}

#branding {
width: 700px;
height: 200px;
background:url(/images/branding.gif) no-repeat;
}

h1 {
padding-left: 30px;
background: url(/images/bullet.gif) no-repeat left center;
}

h1 {
padding-left: 30px;
background: url(/images/bullet.gif) no-repeat 0 50%;
}

Rounded-corner boxes

.box {
width: 418px;
background: #effce7 url(images/bottom.gif) no-repeat left bottom;
}
.box h2 {
background: url(images/top.gif) no-repeat left top;
}
.box h2 {
padding: 10px 20px 0 20px;
}
.box p {
padding: 0 20px 10px 20px;
}

Headline

Content

.box {
width: 424px;
background: url(images/bg-tile.gif) repeat-y;
}
.box h2 {
background: url(images/bg-top.gif) no-repeat left top;
padding-top: 20px;
}
.box .last {
background: url(images/bg-bottom.gif) no-repeat left bottom;
padding-bottom: 20px;
}
.box h2, .box p {
padding-left: 20px;
padding-right: 20px;
}

Headline

Content

Flexible rounded-corner box

.box {
width: 20em;
background: #effce7 url(images/bottom-left.gif)
no-repeat left bottom;
}
.box-outer {
background: url(images/bottom-right.gif) no-repeat right bottom;
padding-bottom: 5%;
}
.box-inner {
background: url(images/top-left.gif) no-repeat left top;
}
.box h2 {
background: url(images/top-right.gif) no-repeat right top;
padding-top: 5%;
}
.box h2, .box p {
padding-left: 5%;
padding-right: 5%;
}

Headline

Content

Mountaintop corners

Headline

Content

Drop shadows

Easy CSS drop shadows

.img-wrapper {
background: url(images/shadow.gif) no-repeat bottom right;
clear: right;
float: left;
}
.img-wrapper img {
margin: -5px 5px 5px -5px;
}

height="300" alt="Dunstan Orchard" />

.img-wrapper img {
background-color: #fff;
border: 1px solid #a9a9a9;
padding: 4px;
margin: -5px 5px 5px -5px;
}

.img-wrapper {
background: url(images/shadow.gif) no-repeat bottom right;
clear: right;
float: left;
position: relative;
}
.img-wrapper img {
background-color: #fff;
border: 1px solid #a9a9a9;
padding: 4px;
display: block;
margin: -5px 5px 5px -5px;
position: relative;
}

Drop shadows a la Clagnut

.img-wrapper {
background: url(images/shadow.gif) no-repeat bottom right;
float:left;
line-height:0;
}
.img-wrapper img {
background:#fff;
padding:4px;
border:1px solid #a9a9a9;
position:relative;
left:-5px;
top:-5px;
}

Fuzzy shadows

.img-wrapper {
background: url(images/shadow.gif) no-repeat right bottom;
float: left;
}
.img-wrapper div {
background: url(images/mask.png) no-repeat left top !important;
background: url(images/mask.gif) no-repeat left top;
padding: 0 5px 5px 0;
float: left; /* :KLUDGE: Fixes problem in IE5.2/Mac */
}
.img-wrapper img {
background-color: #fff;
border: 1px solid #a9a9a9;
padding: 4px;
}

Onion skinned drop shadows

.img-wrapper {
background:url(images/shadow.gif) no-repeat right bottom;
float: left;
}
.img-outer {
background:url(images/bottom-left2.gif) no-repeat left bottom;
float: left; /* :KLUDGE: Fixes problem in IE5.2/Mac */
}
.img-inner {
background:url(images/top-right2.gif) no-repeat top right;
padding: 0 5px 5px 0;
float: left; /* :KLUDGE: Fixes problem in IE5.2/Mac */
}
.img-wrapper img {
background-color: #fff;
border: 1px solid #a9a9a9;
padding: 4px;
display: block;
}

alt="Dunstan" />

Image replacement

Fahrner Image Replacement (FIR)

h2 {
background:url(hello_world.gif) no-repeat;
width: 150px;
height: 35px;
}
span {
display: none;
}

Hello World

Phark

h2 {
text-indent: -5000px;
background:url(hello_world.gif) no-repeat;
width: 150px;
height:35px;
}

Hello World

Gilder/Levin method

h2 {
width: 150px;
height: 35px;
position: relative;
}
h2 span {
background: url(hello_world.gif) no-repeat;
position: absolute;
width: 100%;
height: 100%;
}

Hello World

尨奇 2007-04-03 14:44 发表评论

VISUAL FORMATTING MODEL RECAP

尨奇 — Mon, 02 Apr 2007 08:49:00 GMT

在这章我们将学习到：

1.盒子模式的复杂和特征
2.怎样并且为什么页边空白收缩
3.绝对位置和相对位置的不同
4.floating 和 clearing怎样工作

Box model recap

* {
margin: 0;
padding: 0;
}

#myBox {
margin: 10px;
padding: 5px;
width: 70px;
}

Margin collapsing

Positioning recap

Relative positioning 相对位置

#myBox {
position: relative;
left: 20px;
top: 20px;
}

Absolute positioning 绝对位置

#branding {
width: 700px;
height: 100px;
position: relative;
}
#branding .tel {
position: absolute;
right: 10px;
bottom: 10px;
text-align: right;
}

Tel: 0845 838 6163

Floating

Line boxes and clearing

.news {
background-color: gray;
border: solid 1px black;
}
.news img {
float: left;
}
.news p {
float: right;
}

Some text

.news {
background-color: gray;
border: solid 1px black;
}
.news img {
float: left;
}
.news p {
float: right;
}
.clear {
clear: both;
}

Some text

更简捷的方法如下:

.news {
background-color: gray;
border: solid 1px black;
float: left;
}
.news img {
float: left;
}

.news p {
float: right;
}

Some text

尨奇 2007-04-02 16:49 发表评论

css mastery 读书笔记

尨奇 — Sat, 31 Mar 2007 11:18:00 GMT

让我们开始阅读这本书

我所用的工具

UltraEdit

IE 浏览器

第1章打下基础

在这章我们将学习到：

1.一个好的结构的重要性和有意义的文档
2.编写最优方法
3.共有的编写错误
4.文档类型，DOCTYPE switching和浏览器样式
5.建立自己的样式
6.层叠，特征和继承

(X)html包括很多元素。例如

h1,h2,..
ul,ol,dl
strong,em
blockquote,cite
abbr,acronym,code
fieldset,legend,label
caption,thead,tbody,tfoot

IDs 和类名(class names)

Home

About Us

Contact

Divs 和 spans

Home

About Us

Contact

简化

Home

About Us

Contact

Where’s Durstan?

Published on March 22nd, 2005
by Andy Budd

DOCTYPE switching
(X)HTML 文档遵循的文档类型定义(DTD)。

"http://www.w3.org/TR/html4/strict.dtd">

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

建立自己的样式

Common selectors

Type selectors

p {color: black;}
a {text-decoration: underline;}
h1 {font-weight: bold;}

descendant selectors

li a {text-decoration: none;}

ID and class selectors

#intro {font-weight: bold;}
.datePosted {color: green;}

Some Text

24/3/2006

#mainContent h1 {font-size: 1.8em;}
#secondaryContent h1 {font-size: 1.2em;}

Welcome to my site

...

Latest news

...

Pseudo-classes

/* makes all unvisited links blue */
a:link {color:blue;}

/* makes all visited links green */
a:visited {color:green;}

/* makes links red when hovered or activated */
a:hover, a:active {color:red;}

/* makes table rows red when hovered over */
tr:hover {background-color: red;}

/* makes input elements yellow when focus is applied */
input:focus {background-color:yellow;}

IE 6 对 :focus不支持

The universal selector

* {
padding: 0;
margin: 0;
}

Advanced selectors

Child and adjacent sibling selectors

#nav > li {font-weight: bold;}

Home

Services
- Design
- Development
- Consultancy

覆盖
#nav li {font-weight: bold;}
#nav li * {font-weight: normal;}

共用
h1 + p {font-weight: bold;}

Main Heading

First Paragraph

Second Paragraph

Attribute selectors

CSS

abbr[title] {border-bottom: 1px dotted #999;}
abbr[title]:hover {cursor: help;}

a[rel="nofollow"] {
background-image: url(nofollow.gif);
padding-right: 20px;
}

.intro {border-style: solid;}
[class="intro"] {border-style: dotted;}

a[rel~="friend"] {background-image: url(friend.gif);}
http://www.hicksdesign.com/" rel="friend met colleague" >
John Hicks

尨奇 2007-03-31 19:18 发表评论

Simple Factory 模式

尨奇 — Wed, 25 Oct 2006 04:45:00 GMT

Simple Factory 模式(又称Static Factory模式),一个Simple Factory 生产成品,而对客户端隐藏产品生产细节.实现定义一个产品界面(interface),并通过特定静态方法来建立成品.
假设有一个音乐盒工厂,购买音乐盒的顾客不知道音乐盒是如何制作的,他只要知道如何播放音乐盒就可以了,以UML类图来表示以上概念.

如图上所示,MusicBoxDemo代表了客户的角色,它只依赖于IMusicBox界面,而不关心是如何实现的.如何产生IMusicBox由MusicBoxFactory完成.以一个简单的程序来实现上面这个UML类图:

IMusicBox.java

    public interface IMusicBox {
     public void play();
   }

PianoBox.java

   public class PianoBox implements IMusicBox {
       public void play() {
          System.out.println("播放钢琴音乐:)");
      }
   }

ViolinBox.java

   public class ViolinBox implements IMusicBox {
       public void play() {
          System.out.println("播放小提琴音乐^_^");
      }
   }

MusicBoxFactory.java

    public class MusicBoxFactory {
      public static IMusicBox createMusicBox(String name) 
                               throws InstantiationException, 
                                      IllegalAccessException, 
                                      ClassNotFoundException {
        // 这边使用的是Java的Reflection机制来产生实例
        // 不过客户端不用管啦
        // 以后就算改变了这边的程序，客户端程序是不用更改的
        return (IMusicBox) Class.forName(name).newInstance();
       }
     }

MusicBoxDemo.java

   public class MusicBoxDemo {
      public static void main(String[] args) throws Exception {
        playMusicBox(MusicBoxFactory.createMusicBox("PianoBox"));
        playMusicBox(MusicBoxFactory.createMusicBox("ViolinBox"));
      }

      public static void playMusicBox(IMusicBox musicBox) {
        musicBox.play();
      }
   }

由于客户端只依赖与IMusicBox介面，所以即使您日后改变了createMusicBox()中的实现方式，对客户端是一点影响也没有的.

来看看Simple Factory的类结构：

客户只要面对Factory，客户依赖于产品介面，产品的具体实现是可以与客戶隔开的，它们也是可以抽换的.

尨奇 2006-10-25 12:45 发表评论

mysql入门2

尨奇 — Wed, 18 Oct 2006 06:47:00 GMT

1.DESCRIBE

为了验证你的表是按你期望的方式创建，使用一个DESCRIBE语句：

你可以随时使用DESCRIBE，例如，如果你忘记表中的列的名称或类型时。

2.DISTINCT

请注意该查询只是简单地检索每个记录的owner列，并且他们中的一些出现多次。
为了使输出减到最少，增加关键字DISTINCT检索出每个唯一的输出记录：

mysql> SELECT DISTINCT owner FROM pet;

3.ORDER BY

你可能已经注意到前面的例子中结果行没有以特定的顺序显示。
然而，当行按某种方式排序时，检查查询输出通常更容易。
为了排序结果，使用ORDER BY子句。

mysql> SELECT name, birth FROM pet ORDER BY birth;

默认排序是升序ASC，最小的值在第一。要想以降序排序，
在你正在排序的列名上增加DESC（降序）关键字

mysql> SELECT name, birth FROM pet ORDER BY birth DESC;

4.GROUP BY

使用GROUP BY对每个owner的所有记录分组
COUNT( )和GROUP BY以各种方式分类你的数据。下列例子显示出进行动物普查操作的不同方式。

每种动物的数量：

mysql> SELECT species, COUNT(*) FROM pet GROUP BY species;

尨奇 2006-10-18 14:47 发表评论

mysql入门1

尨奇 — Wed, 18 Oct 2006 06:06:00 GMT

连接服务器
C:\Documents and Settings\Administrator>mysql -u root
Enter password: ********
断开服务器
mysql> \q
查询版本号和当前日期
mysql> SELECT VERSION(), CURRENT_DATE;
+----------------------+--------------+
| VERSION()            | CURRENT_DATE |
+----------------------+--------------+
| 5.0.24a-community-nt | 2006-10-18   |
+----------------------+--------------+
不必全在一个行内给出一个命令，较长命令可以输入到多个行中。
mysql> select user()
        -> ,
        ->current_date;

+----------------+--------------+
| user()         | current_date |
+----------------+--------------+
| root@localhost | 2006-10-18   |
+----------------+--------------+

如果你决定不想执行正在输入过程中的一个命令，输入\c取消它：
mysql> select
       -> user()
       -> \c
mysql>

尨奇 2006-10-18 14:06 发表评论

3.4 埃拉托色尼筛选

尨奇 — Mon, 16 Oct 2006 10:51:00 GMT

质数算法
   这个质数算法比较新颖,效率也比较高.
class Primes
{
    public static void main(String[] args)
      { int N = Integer.parseInt(args[0]);
        boolean[] a = new boolean[N];
        for (int i = 2; i < N; i++) a[i] = true;
        for (int i = 2; i < N; i++)
          if (a[i] != false)
            for (int j = i; j*i < N; j++)
              a[i*j] = false;
        for (int i = 2; i < N; i++)
          if (i > N - 100)
            if (a[i]) Out.print(" " + i);
        Out.println();
      }
}

尨奇 2006-10-16 18:51 发表评论

CSS学习第一天

尨奇 — Tue, 10 Oct 2006 11:44:00 GMT

CSS是Cascading Style Sheets的缩写.在一个网页中引入CSS有2种方式:


     也可以直接在网页中直接添加如下:

i'm red

你好

Home

About Us

Contact

Where’s Durstan?

Published on March 22nd, 2005

by Andy Budd

Some Text

24/3/2006

Welcome to my site

...

Latest news

...

Home

Services
- Design
- Development
- Consultancy

尨奇 2006-10-10 19:44 发表评论

JSF第二天

尨奇 — Tue, 05 Sep 2006 06:43:00 GMT

摘要: A Sample Application 以一个猜数字的例子来学习 Managed Beans 。如图 2-1 ... 阅读全文

尨奇 2006-09-05 14:43 发表评论

语源科技BlogJava-wz5270

请不要做浮躁的人 （转自叶枫）

BACKGROUND IMAGES AND IMAGE REPLACEMENT

Headline

Headline

Headline

Headline

Hello World

Hello World

Hello World

VISUAL FORMATTING MODEL RECAP

css mastery 读书笔记

Where’s Durstan?

Welcome to my site

Latest news

Main Heading

Simple Factory 模式

mysql入门2

mysql入门1

3.4 埃拉托色尼筛选

CSS学习第一天

Where’s Durstan?

Welcome to my site

Latest news

JSF第二天

请不要做浮躁的人（转自叶枫）