在工作中是否遇到这种情况。。
1.写好的一个html片段。暂时不需要了。。过一会又有人跑过来跟你说，刚才的那段还要。。。又过了一会他又说还是不要算了。。。。。囧。。。
2.页面错乱。。怎么查都查不出原因。。没办法只能用最土的方式。。删html逐一排查。。。
对于这类情况，我们多数是用注释去解决。。。但html复杂的注释语句真的是让人无法忍受。。。试想在第一种情况中。反复的敲打“<!– –>”是多么的让人浮躁啊。。
来搞个注释开关吧，来快速打开和关闭注释。。。。。
在需要设置注释的上下各写两个空注释。基本格式如下图
当我们要打开注释开关，注释掉文本的时候，只需要将文本上面的空注释的结束>删除即可。见下图。
想反的当需要关闭注释的时候，只需要再把>补上即可关闭。。。
是不是很有意思。。 。。不过我更是习惯通过删除“-”来控制开关。 因为打>的时候还需要按住shift。。。太累。。。
在让我们看看其他的注释开关。 继续阅读本篇日志 »
我们经常使用到a,button,input等标签，通过css加背景等方式来实现按钮的效果。但是要做一个通用的样式类，又能保证在各个浏览器下表现一致，还能有很好的扩展性的按纽可不就那么容易了。好了废话少说。进入正题。
首先我们选择a和button两个标签作为通用按纽的外包装器。主要考虑到，在ie6不支持a以外的:hover伪类，使用a就可以对按钮做悬浮状态，这就是为什么选择他们做为最外层的包装器而不是span或者其他的标签。为什么不用input下面会详细说到。
先来认识一下button的类型(type)，button，默认的类型。submit，该可以用来提交表单，功能同<input type=”submit” value=”提交” />。reset，可以用来恢复表单默认值。如下
<form action=""> <input type="text" value="I LOVE CHINA" /> <button type="button">type="button"，我是一个默认的button,</button> <button type="submit">type="submit"，我可以用来提交表单</button> <button type="reset">type="reset"，我可以来恢复表单默认值</button> </form>
之前说了，当button的type属性为submit的时候，同样可以对表单进行提交，那为什么要选择button,而不是input。原因有两点。
但如果想让button在各个浏览器和各种操作系统下表现一致。还是一件比较让人头疼的事情。 继续阅读本篇日志 »
首先先对行内元素（inline elements，比如span,a,b等。）和块元素(block elements，比如div,h1,p等)进行一下知识回顾.简而言之，它们的区别可以分为下几点
在前端开发中，我们遵循结构，表现，行为相分离。所以将修饰型图片利用css的background把它写在表现层中。那最常见的就是icon的应用。如：
去我的flickr相册。这是利用行内元素的左侧内间距（padding-left）实现的icon+文字的组合。
但有时候，我们还需要另外一种表现形式，只是单独的icon而不需要文字或者链接，并且是图文混排。也许你想只要把span里面的文字删除不就可以了么，实际上并非如你所愿。
。如果你现在在ie下，肯定什么也看不到。
原因是行内元素在内容为空的情况下,ie认为它的width为0。
,现在在ie下可以看到了。
根据行内元素的特性，并不能为其设置一个宽度来解决，所以只能在里面加一个毫无意义的空格用来占位，来生成一个高度值，但在无css的条件下（在spider的眼里），无法得知它为何物。如下:
<a class="icon-flickr"> </a>
所以这样的解决方案让人无法接受。
使用inline-block就可以解决这个问题 继续阅读本篇日志 »
最近才知道intype能支持中文了…
真是太落伍了….不过默认的只能用”宋体”…代码看起来简直别扭死了..
搜了下还真有方法能改.就是修改user目录下的preferences.itConfig文件.
font_name改成”微软雅黑”.
在加上YUI的语法加亮和函数提示包
http://intype.info/download/bundles/JavaScript_YUI.itBundle.zip
爽了…..
轻量级的IDE,这次真的可以跟EDIT PLUS说拜拜喽~
如何组织和策划一个活动(做网站的推广,运营).
今天参加一个需求确认会想到的.
往往看到很多活动.
希望做出很多的亮点,比如漂亮的界面,高趣味性等等…
以此来达到提高PV,增加用户黏度等目的.
其实就是给用户以动力.
但有时这样的动力并不是想象中的那样叠加,而是取之中的最大值..(甚至适得其反)
第2,活动本身应该简单.快速.
如果是冲PV,活动本身交互设计就不应该成为限制用户点击流的障碍.
比如,
一个答题活动A,一道题需要思考,观察,键盘输入等等繁复操作,用时5分钟.答对了给你2个铜钱.
2万个铜钱换一个手机.
另一个答题活动B,只需要10秒种,答对了同样给你2个铜钱,同样是2万个铜钱换一个手机.
哪个更能让你感觉得到奖品?
总结两个字简单,快速(simple,fast)
我们最常用的有四种选择方法，
Id规则选取，比如
button#button{}
#urlBar[type=”text”] { }
div > p > span#demo{}
class规则选取，比如
button.toolbarButton { }
.fancyText { }
menuitem > .menu-left[checked=”true”] { }
Tag规则选取，比如
td { }
div > p { }
input[type=”checkbox”] { }
统配选择器，比如
*
：after
[hidden=”true”]
他们都是从最右边开始匹配，直到最左边整个规则结束。
这样就存在一个问题，比如说最右边的规则已经能确定你要选取到元素。
那更多的规则匹配就造成了性能上的浪费。
比如说div > p > span#demo{}
div > p > span根本没有意义。
Fiddler
一个很强大的http流查看工具
http://www.fiddlertool.com/fiddler/
Httpwatch
数据分析工具,头消息接受/发送的查看,POST数据查看.等等
http://www.httpwatch.com
IE Developer Toolsbar
IE下的FireBug.HTML及CSS调试工具
http://www.windowsmarketplace.com/details.aspx?itemid=2695980
Companion.JS
IE下的javascript调试工具.福音啊!福音啊!!福音啊!!!
http://www.my-debugbar.com/wiki/CompanioNJS/HomePage
FireBug
强的没话说了已经….如果你不知道这是什么….那我更没话说了….
https://addons.mozilla.org/en-US/firefox/addon/1843
Web Developer
FireFox下的查看工具,可以查看JS,CSS等页面信息
https://addons.mozilla.org/en-US/firefox/addon/60
YSlow
why slow?页面性能优化查看器.基于FireBug
http://developer.yahoo.com/yslow
Javascript Debugger
FireFox下的javascript调试工具,比FireBug有更强大的调试功能.
https://addons.mozilla.org/en-US/firefox/addon/216
Opera Developer Tools
Opera下的DOM,CSS查看工具,类似FireBug.
http://dev.opera.com/articles/view/opera-developer-tools/
webkit
Safari下的开发调试工具
http://nightly.webkit.org/
一个需求，通过传递的参数操作指定节点的父节点属性。
先取当前的href地址
通过&分割和正则取参数和值
在通过parentNote取上级节点
var _href = document.location.href;
_href = _href.split(”&”);
for(var i = 0;i<_href.length;i++){
var result = _href[i].match(/para/); //para为要取参数的名字
if(result!=null){
result = result.split(”=”);
var curNode = documnet.getElementById(result[1]);
curNode.parentNode.style.display=”block”;
}
}
老外写的.如何写出漂亮的HTML代码.总结的不错.拿出来分享一下.
1.DOCTYPE Properly Declared
别忘记头部的声明.它会告诉浏览器如何渲染你的HTML.
2.Tidy Head Section
设置title,字符集.将CSS和JS外链(包括一个打印用的CSS).
3.Body IDed
给body一个ID.这里作者提到的原因是.为多页面的中容器选择提供便利.比如通过给page1和page2中BODY设置不同的ID.就可以通过#page1 h2和#page2 h2来设置两种不同的效果.我感觉这个到是要看情况和具体架构再具体使用.
4.Semantically Clean Menu
编写符合语意的菜单代码.
<div id=”menu”>
<ul>
<li><a href=”index.php”>Home</a></li>
<li><a href=”about.php”>About</a></li>
<li><a href=”contact.php”>Contact</a></li>
</ul>
</div>
5.Main DIV for all Page Content
要有一个主体DIV包含所有的内容.方便固定主体的宽度,边距等等.
6.Important Content First
先写主要内容,再写次要内容.如果你的导航或者侧边栏不是很重要,最好将他们写在最后.
