Soking.name

金华建筑艺术公园

soking — Mon, 09 Apr 2012 16:44:54 +0000

金华原来还存在这么一个地方。它在荒芜与冷清中默默的存在着。我喜欢这里。

简短的wiki传送门： http://zh.wikipedia.org/wiki/金華建築藝術公園

茶花公园拍茶花

soking — Mon, 09 Apr 2012 14:05:18 +0000

HTML特殊字符大全[转]

soking — Tue, 31 Jan 2012 01:52:03 +0000

HTML的特殊字符我们并不常用，但是有的时候却要在页面中用到这些字符，甚至有时候还需要用这些字符来实现某种特殊的视觉效果。现在，国外的设计师Neal Chester整理了一份很全的特殊字符集，我觉得这很赞～～，共享出来供大家查阅吧。

使用方法：

这些字符属于unicode字符集，所以，你的文档需要声明为UTF-8；
下面符号列表的后面有两列编号，它们并不太一样，第一列是用于HTML的，你需要在前面加上&#符号；
第二列可以用于CSS文件中，但是需要用反斜杠\转义；
第二列也可以用于JavaScript，和CSS用法一样，不过要用\u来转义。

需要主意的是：

有的字符在不同的浏览器下表现不太一样；比如小雪人 ☃ 在Firefox和Chrome下不太一样，钻石 ◆ 在IE下要比Chrome下要大一点儿；
有的字符在某个浏览器下不会显示；当然原因并不是字符代码的问题，而是浏览器的bug，比如，–在Chrome下。。。
但是，98%的字符都能在所有浏览器下正常显示的，不过如果你真的要使用，最好仔细在各个浏览器下验证一番。
经测试这些字符在Android/iOS等智能终端的识别度比较差，所以，使用的时候要特别注意移动浏览器～～

各种箭头

⇠ 8672 21E0
⇢ 8674 21E2
⇡ 8673 21E1
⇣ 8675 21E3
↞ 8606 219E
↠ 8608 21A0
↟ 8607 219F
↡ 8609 21A1
← 8592 2190
→ 8594 2192
↑ 8593 2191
↓ 8595 2193
↔ 8596 2194
↕ 8597 2195
⇄ 8644 21C4
⇅ 8645 21C5
↢ 8610 21A2
↣ 8611 21A3
⇞ 8670 21DE
⇟ 8671 21DF
↫ 8619 21AB
↬ 8620 21AC
⇜ 8668 21DC
⇝ 8669 21DD
↚ 8602 219A
↛ 8603 219B
↮ 8622 21AE
↭ 8621 21AD

形状

⇦ 8678 21E6
⇨ 8680 21E8
⇧ 8679 21E7
⇩ 8681 21E9
↷ 8631 21B7
↶ 8630 21B6
↻ 8635 21BB
↺ 8634 21BA
⟳ 10227 27F3
⟲ 10226 27F2
⟰ 10224 27F0
⟱ 10225 27F1
↵ 8629 21B5
↯ 8623 21AF
⇵ 8693 21F5

向右的箭头

➔ 10132 2794
➙ 10137 2799
➨ 10152 27A8
➲ 10162 27B2
➜ 10140 279C
➞ 10142 279E
➟ 10143 279F
➠ 10144 27A0
➤ 10148 27A4
➥ 10149 27A5
➦ 10150 27A6
➧ 10151 27A7
➵ 10165 27B5
➸ 10168 27B8
➼ 10172 27BC
➽ 10173 27BD
➺ 10170 27BA
➳ 10163 27B3
➾ 10174 27BE

基本形状

▲ 9650 25B2
► 9658 25BA
▼ 9660 25BC
◄ 9668 25C4
❤ 10084 2764
✈ 9992 2708
★ 9733 2605
✦ 10022 2726
☀ 9728 2600
◆ 9670 25C6
◈ 9672 25C8
▣ 9635 25A3

标点

« 171 00AB
» 187 00BB
‹ 139 008B
› 155 009B
“ 8220 201C
” 8221 201D
‘ 8216 2018
’ 8217 2019
• 8226 2022
◦ 9702 25E6
¡ 161 00A1
¿ 191 00BF
℅ 8453 2105
№ 8470 2116
& 38 0026
@ 64 0040
℞ 8478 211E
℃ 8451 2103
℉ 8457 2109
° 176 00B0
| 124 007C
¦ 166 00A6
– 8211 2013
— 8212 2014
… 8230 2026
¶ 182 00B6
∼ 8764 223C
≠ 8800 2260

法律符号

® 174 00AE
© 169 00A9
℗ 8471 2117
™ 153 0099
℠ 8480 2120

货币

$ 36 0024
¢ 162 00A2
£ 163 00A3
¤ 164 00A4
€ 8364 20AC
¥ 165 00A5
₱ 8369 20B1
₹ 8377 20B9

数学

½ 189 00BD
¼ 188 00BC
¾ 190 00BE
⅓ 8531 2153
⅔ 8532 2154
⅛ 8539 215B
⅜ 8540 215C
⅝ 8541 215D
‰ 8240 2030
% 37 0025
< 60 003C
> 62 003E

音乐符号

♩ 9833 2669
♪ 9834 266A
♫ 9835 266B
♬ 9836 266C
♭ 9837 266D
♯ 9839 266F

对号、错号

160 00A0
☐ 9744 2610
☑ 9745 2611
☒ 9746 2612
✓ 10003 2713
✔ 10004 2714
✕ 10005 10005
✖ 10006 2716
✗ 10007 2717
✘ 10008 2718

十字

☨ 9768 2628
☩ 9769 2629
✝ 10013 271D
✞ 10014 271E
✟ 10015 271F
✠ 10016 2720
✚ 10010 271A
† 8224 2020
✢ 10018 2722
✤ 10020 2724
✣ 10019 2723
✥ 10021 2725

星星、星号、雪花

★ 9733 2605
✭ 10029 272D
✮ 10030 272E
☆ 9734 2606
✪ 10026 272A
✡ 10017 2721
✯ 10031 272F
✵ 10037 2735
✶ 10038 2736
✸ 10040 2738
✹ 10041 2739
✺ 10042 273A
✱ 10033 2731
✲ 10034 2732
✴ 10036 2734
✳ 10035 2733
✻ 10043 273B
✽ 10045 273D
❋ 10059 274B
❆ 10054 2746
❄ 10052 2744
❅ 10053 2745

杂项

☻ 9787 263B
☺ 9786 263A
☹ 9785 2639
✉ 9993 2709
☎ 9742 260E
☏ 9743 260F
✆ 9990 2706
� 65533 FFFD
☁ 9729 2601
☂ 9730 2602
❄ 10052 2744
☃ 9731 2603
❈ 10056 2748
✿ 10047 273F
❀ 10048 2740
❁ 10049 2741
☘ 9752 2618
❦ 10086 2766
☕ 9749 9749
❂ 10050 2742
☥ 9765 2625
☮ 9774 262E
☯ 9775 262F
☪ 9770 262A
☤ 9764 2624
✄ 9988 2704
✂ 9986 2702
☸ 9784 2638
⚓ 9875 2693
☣ 9763 2623
⚠ 9888 26A0
⚡ 9889 26A1
☢ 9762 2622
♻ 9851 267B
♿ 9855 267F
☠ 9760 2620

手型、铅笔、笔

☜ 9756 261C
☞ 9758 261E
☝ 9757 261D
☟ 9759 261F
✌ 9996 270C
✍ 9997 270D
✎ 9998 270E
✐ 10000 2710
✏ 9999 270F
✑ 10001 2711
✒ 10002 2712

天空、植物

☽ 9789 263D
☾ 9790 263E
♂ 9794 2642
♀ 9792 2640
☿ 9791 263F
♁ 9793 2641
♃ 9795 2643
♄ 9796 2644
♅ 9797 2645
♆ 9798 2646
♇ 9799 2647

星座

♈ 9800 2648
♉ 9801 2649
♊ 9802 264A
♋ 9803 264B
♌ 9804 264C
♍ 9805 264D
♎ 9806 264E
♏ 9807 264F
♑ 9809 2651
♒ 9810 2652
♓ 9811 2653

象棋，扑克牌

♚ 9818 265A
♛ 9819 265B
♜ 9820 265C
♝ 9821 265D
♞ 9822 265E
♟ 9823 265F
♔ 9812 2654
♕ 9813 2655
♖ 9814 2656
♗ 9815 2657
♘ 9816 2658
♙ 9817 2659
♠ 9824 2660
♣ 9827 2663
♥ 9829 2665
♦ 9830 2666
♤ 9828 2664
♧ 9831 2667
♡ 9825 2661
♢ 9826 2662

希腊字母

Α 913 0391
Β 914 0392
Γ 915 0393
Δ 916 0394
Ε 917 0395
Ζ 918 0396
Η 919 0397
Θ 920 0398
Ι 921 0399
Κ 922 039A
Λ 923 039B
Μ 924 039C
Ν 925 039D
Ξ 926 039E
Ο 927 039F
Π 928 03A0
Ρ 929 03A1
Σ 931 03A3
Τ 932 03A4
Υ 933 03A5
Φ 934 03A6
Χ 935 03A7
Ψ 936 03A8
Ω 937 03A9

雨中三清山。

soking — Sun, 25 Sep 2011 15:26:59 +0000

雨中游三清山，到处烟雾缭绕，很多景观看不到。披着雨衣，匆匆走了一遍，意犹未尽，有机会肯定会再去。

hasLayout–IE CSS bug的祸源[转]

soking — Wed, 21 Sep 2011 08:32:14 +0000

看完这个，应该大部分IE下CSS布局的奇怪问题都能顺利解决了。
———————————————————–

什么是hasLayout？

要想更好的理解 css，尤其是 IE 下对 css 的渲染，haslayout 是一个非常有必要彻底弄清楚的概念。大多IE下的显示错误，就是源于 haslayout。

haslayout 是Windows Internet Explorer渲染引擎的一个内部组成部分。在InternetExplorer中，一个元素要么自己对自身的内容进行计算大小和组织，要么依赖于父元素来计算尺寸和组织内容。为了调节这两个不同的概念，渲染引擎采用了 hasLayout 的属性，属性值可以为true或false。当一个元素的 hasLayout属性值为true时，我们说这个元素有一个布局（layout）。

通过 IE Developer Toolbar 可以查看 IE 下 HTML元素是否拥有haslayout，在 IE Developer Toolbar 下，拥有 haslayout的元素，通常显示为“haslayout = -1”。什么情况下hasLayout不会出现？

一般情况都不会出现，当然除了下面罗列的默认具有hasLayout的元素和使用特定样式触发以外；
它会带来各种诡异表现，当你发现IE7-出现了一些不可思议的问题，首先要检查的就是是否是hasLayout在捣鬼；
hasLayout只出现在IE7及更早版本中，IE8不存在hasLayout解析模式，我们只讨论指定doctype的情况。

hasLayout的触发条件：

position: absolute(IE5+)
float: left|right(IE5+)
display: inline-block(IE5+)
width: “auto”以外的任何值(IE5+; 对inline元素无效)
height: “auto”以外的任何值(IE5+; 对inline元素无效)
zoom: “normal”以外的任何值(IE5.5+; IE私有属性)
writing-mode: tb-rl(IE5+; IE私有属性)
overflow: hidden|scroll|auto(IE7; 此属性在IE6及更早版本中不能应用在未触发hasLayout的元素上)
overflow-x|-y: hidden|scroll|auto(IE7; 此属性在IE6及更早版本中不触发hasLayout; 此属性在CSS3中才获支持)
min-width: 任何值(IE7; 即使是0)
max-width: “none”以外的任何值(IE7)
min-height: 任何值(IE7)
max-height: “none”以外的任何值 (IE7)
position: fixed(IE7)

清除或重置hasLayout：

position: static(IE5+)
float: none(IE5+)
display: “inline-block”以外的任何值(IE5+)
width|height: “auto”(IE5+; 对inline元素无效)
zoom: “normal”(IE5.5+; IE私有属性)
writing-mode: 从’tb-rl’到’lr-tb’(IE5+; IE私有属性)
max-width|max-height: “none”(IE7)
overflow: visible(IE7)

haslayout 问题的调试与解决

当网页在ff中表现正常，而在 IE7 或更早版本中有异常表现时，可以尝试激发 haslayout 来看看是不是问题所在。常用的方法是给某元素 css 设定zoom:1。使用 zoom:1 是因为大多数情况下，它能在不影响现有环境的条件下激发元素的 haslayout。而一旦问题消失，那基本上就可以判断是haslayout 的原因。然后就可以通过设定相应的 css 属性来对这个问题进行修正了。建议首先要考虑的是设定元素的width/height 属性，其次再考虑其他属性。

对于IE7 ，最好的办法是设置最小高度属性为0；这个技术是无害的，因为0本来就是这个属性的初始值。而且没有必要对其他浏览器隐藏这个属性。

对 IE6 及更早版本来说，常用的方法被称为霍莉破解(Holly hack)，即设定这个元素的高度为 1%(height:1%;)。需要注意的是，当这个元素的 overflow 属性被设置为 visible 时，这个方法就失效了。或者使用 IE的条件注释。

————————-一些具体问题——————–

1.图片label bug，影响版本ie6/ie7/ie8，当label中有img的时候无法触发点击选中form元素事件.
解决方案：通过给内加入一个空的span标签，然后设置 position:absolute；background:url(#); 设置label float:left; position:relative;overflow:hidden;就可以解决了。

2.设置margin auto的button没有居中，影响版本ie8，ie8下，如果给像button这样的标签（如button input[type="button"] input[type="submit"]）设置{ display: block; margin-left: auto; margin-right: auto; }如果不设置宽度的话无法居中。

3.不正确的浮动伸展布局，影响版本ie6/ie7，连续浮动的元素并且设置clear属性没法自动伸展
demo http://haslayout.net/demos/Incorrect-Float-Shrink-Wrap-Bug-Demo.html
fix demo http://haslayout.net/demos/Incorrect-Float-Shrink-Wrap-Bug-Fixed-Demo.html
解决方法：给连续浮动元素加一个span然后设置display:inline-block和display:block

4.文档滚动bug，影响版本ie6/ie7，不在html标签上设置overflow或许会影响到body上面的overflow
具体请看http://haslayout.net/css/Document-Scrollbars-Overflow-Inconsistency

5.连续浮动元素bug，影响版本ie6/ie7，http://haslayout.net/css/Float-Squeeze-Weird-Gap-Bug

6.连续浮动字符出现重复字符，影响版本ie6/ie7,[url]http://haslayout.net/css/Float-Squeeze- Duplicate-Last-Character-Bug[/url]
这个和5的解决方案都差不多，5是通过加一个宽度，而这个是通过给浮动字符加一个position:relative;

7.空元素高度bug，影响版本ie6/ie7，有layout的空元素获得了高度

8.表单元素双margin bug,影响版本ie6/ie7,input和textarea或许会继承父元素的水平的margin
具体请看http: //haslayout.net/css/Form-Control-Double-Margin-Bug

9.ie7的1px dotted 边框变成dashed边框的bug,影响版本ie7, 当设置了1px dotted边框后，有一个边框的宽度大于1px
的话其它为1px边框会变为dashed的样式，具体请看http://haslayout.net/css/IE7-1px-Dotted-Border-Appears-As-Dashed-Bug

10.overflow bug,影响版本ie6/ie7，当设置了overflow:hidden或auto的元素，如果子元素设置了相对定位，overflow就不起作用了，
表现的是visible的样式，解决方法是给父元素加一个position:relative;

11.ie7的坏的:hover 绝对定位bug，影响版本ie7, 当子元素设置了absolute并且通过设置left top 等来通过:hover时改变其显
示位置时将会不起作用如果他们不再父元素的可视范围内，解决方法是给其加上margin-left:0%;

12.当:active时Button背景偏移，影响版本ie8，给button设置:active时背景会做偏移，可以通过设置:active时的 -ms-background-position-x和-ms-background-position-y来改变这个偏移。

13.:hover边框消失bug，影响版本ie8, 当设置了outline的元素后，再设置:hover的时候，如果设置边框的话，将会不显示

14.百分比padding垂直margin bug，影响版本ie8,当父元素设置了百分比的padding，子元素有垂直的margin的时候，
就好像父元素被设置了margin一样，解决方法是给父元素加一个overflow:hidden/auto

15.图片浮动List标记错位bug，影响版本IE8, 当List里面有浮动的image时，List标记显示的位置跑在里面了，可以通过使用背景图片代替List自带的标记来解决。

16.TH没有继承Text-Align属性的bug，影响版本IE8，当给table设置text-align时，TH没有继承样式，可以通过给TH设置text-align:inherit;来解决IE8下这个丑陋的bug。

17.32个Style限制，影响版本ie6/7/8, 在32个”style”方法(style, link, @import)后浏览器会忽略后面的样式

18.白色背景hover bug，影响版本ie7, 给hover设置background-color:#ffffff;时，背景不会改变，解决方法是设置background:#ffffff;

19.* html bug，影响版本ie6，* html [selector]在ie6下通常不会被忽略，这个bug通常被用来作IE6的hack使用。

20.!important bug, 影响版本ie6, 在important之后设置同样的规则后important会被忽略，这个bug也常被用来指定ie6的样式。

21.png图片和背景颜色不一致，影响版本ie6/7/8, 设置背景颜色和png图片背景同样的颜色代码最后表现不一致，原来是因为ie支持“PNG Gamma profiles”，解决方案是通过一个pngcrush程序来优化图片。

22.auto margin居中bug, 影响版本ie6/7/8, 给block元素设置margin auto无法居中，出现这种bug的原因通常是没有Doctype，然后触发了ie的quirks mode，加上就可以了。

23.:first-line/:first-letter里的!important会忽略，影响版本ie8, 在:first-line/:first-letter里应用!important的规则会被忽略，解决方法就是不用!important

24.:first-letter被忽略的bug, 影响版本ie6, 当:first-letter前面有逗号的时候ie6会忽略这条规则，解决方法是将:first-letter放到最后。

25.浮动元素的阶梯bug, 影响版本ie6/7, 当给一系列

里面的浮动元素设置font-size后会出现阶梯效果，解决方案是给li设置display:inline;

26.List背景消失bug, 影响版本ie6, 当给浮动的div里面的dt, dd, dl设置背景时不显示，解决方案是给dt, dd, dl加上position:relative;

27.noscript样式bug, 影响版本ie6/7/8, 当js可用的时候如果给noscript设置border和背景都可以显示，解决方法就是通过给noscript设置display:none;

28.透明区域无法点击bug, 影响版本ie6/7/8，当给一个display:block元素使用filter来支持png透明的时候，透明区域无法点击，解决方法是不要使用 background:none;filter…，而是background:url(#);filter…

29.List标记偏移，影响版本ie8, 当给list里面的元素设置display和overflow属性后List标记会偏移，解决方法是给里面的元素加一个float:right; width:100%;可以使用ie的条件注释针对ie8

30.ol数字标记不自增, 影响版本ie6/7, 当给li设置宽度时会触发这个bug，解决方法是给li设置display:list-item

31.ul/ol标记消失bug, 影响版本ie6/7, 当ul/ol触发了layout并且有margin-left会触发这个bug，解决方案是给li设置margin-left

32.图片不垂直居中，影响版本ie6/7, 当使用line-height来居中图片时在ie6/7下不会生效，解决方法是在img后加一个空白元素如< /span>

33.没有背景图片bug, 影响版本ie6/7/8, 当使用background的时候如果在url()后没有加空格背景图片就不会显示。

34.自定义鼠标bug, 影响版本ie6/7/8, 当自定义鼠标样式的时候，如果url()里面的路径是相对路径的话，ie会认为相对于当前文档而不会出现鼠标样式的图片，解决方法是采用绝对路径。

35.背景溢出bug, 影响版本ie6, 一个容器里面有浮动元素并且通过加一个clear:both的额外div来清除浮动会产生此bug，解决方案就是建议尽量不要通过增加一个 clear:both的div来清除浮动，可以通过在外层加上overflow:hidden;对于ie可以通过加上zoom:1；来触发ie的 layout

36.高度扩展bug, 影响版本ie6, 当高度很窄如小于12px时ie6会扩展高度，解决方法是设置overlfow:hidden或font-size:0;

37.宽度扩展bug, 影响版本ie6, 当连续英文字符的时候设定宽度不起作用，解决方法是设置overflow:hidden或word-wrap:break-word;

38.浮动双margin，影响版本ie6, 当给一个浮动元素设置margin-left或margin-right时margin加倍，解决方法是加上一条display:inline;

39.负margin bug, 影响版本ie6/7, 当给一个有layout容器里面的元素设置负marin时内容会被截断，解决方法是不让容器有layout或者给负marin的元素设置 position:relative;zoom:1;

40.3px间距bug, 影响版本ie6, 当几个连续浮动且有layout的元素排列时会有3px的间距，解决方法就是给这些元素设置3px的负margin或加上 overflow:hidden;

41.text-align bug, 影响版本ie6/7, 当容器外面设置了text-align，如果容器里面有文本和其他block的元素, block的元素也会继承text-align，这是不正确的，解决方法是重新写出合理的有语义的markup，如文本外面加一个p.

公园随拍。

soking — Wed, 24 Aug 2011 13:14:10 +0000

拍摄地点：黄宾虹公园。天气：阴。本想是去拍荷花，但荷花花期已近尾声，花渐残。所以本集变成随拍了。

隔江。公园在江中，一座古桥连接两岸。

好不容易找到一枝卖相较好的荷花。

苞。

白玉兰，紫玉兰，还是二乔玉兰？没开花我还真分不出来。

马蹄金

芭蕉。隔窗知夜雨，芭蕉先雨声。我想雨夜住旁边的小屋里，肯定别有番诗意。

哈哈发现一颗薜荔。也就是木莲，做凉粉的原料。植物资料传送门 http://dashulin.com/bili

路边台阶上静静的躺着一颗喜树的果子。出门遇喜，好兆头。又一个传送门 http://dashulin.com/xishu

七月的阳光，向日葵。

soking — Fri, 01 Jul 2011 09:30:07 +0000

早听说浙师大种了一大片向日葵，所以赶在花期结束前跑去拍了一组照片。一早出门的时候还是阳光灿烂，等到地一看，靠，日呢？天阴阴的，后面都下起雨来了。去的有些晚了，大部分花都谢了，不过还是能找到一些含苞待放的，黄中带绿的颜色实在是很惹人爱。

Fireworks Texture 纹理包下载

soking — Sat, 23 Apr 2011 05:34:38 +0000

制作整理了这个简单朴素不华丽但很实用的Fireworks的纹理包，分享下。

使用方法1：将压缩包内的纹理图片解压缩到FW安装目录》Configuration》Textures下，重启fireworks就行了。

Fireworks Textures 下载

使用方法2：用fireworks打开下面的png源文件，可作为临时使用。

纹理下方的数字是纹理图片的尺寸，作切片参考之用。

年前发作品

soking — Sun, 30 Jan 2011 15:57:55 +0000

大过年的，怎么也得从硬盘里搜出几张图来发发，然后还果真找到几张，欣喜万分。

8号桥

soking — Tue, 07 Dec 2010 14:16:17 +0000

大众点评网上有人称8号桥是上海的798，去了后才知道什么叫多重夸张手法。