<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Jun Blog &#187; CSS</title>
	<atom:link href="http://www.junstudio.cn/category/css/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.junstudio.cn</link>
	<description>致力于网站重构</description>
	<lastBuildDate>Thu, 29 Jul 2010 14:47:11 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.0</generator>
		<item>
		<title>去掉链接时虚线框的几个方法</title>
		<link>http://www.junstudio.cn/2010/06/remove-the-link-dashed-box/</link>
		<comments>http://www.junstudio.cn/2010/06/remove-the-link-dashed-box/#comments</comments>
		<pubDate>Wed, 23 Jun 2010 12:57:27 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=778</guid>
		<description><![CDATA[1.直接给链接加是onfocus=”this.blur()”. &#60;a href=&#8221;#&#8221; onfocus=&#8221;this.blur()&#8221;&#62;链接&#60;/a&#62; 2.CSS实现 a{blr:expression(this.onFocus=this.close());} /* 只支持IE，过多使用效率低 */ a{blr:expression(this.onFocus=this.blur());} /* 只支持IE，过多使用效率低 */ a:focus { -moz-outline-style: none; } /* IE不支持 */ 3..htc实现IE支持 &#60;public:attach event=&#8221;onfocus&#8221; onevent=&#8221;hscfsy()&#8221;/&#62; &#60;script language=&#8221;javascript&#8221;&#62; function hscfsy(){ this.blur(); } &#60;/script&#62; 调用 a {behavior:url(htc文件所在路径地址)} 4.通过JavaScript遍历实现 window.onload=function() { for(var ii=0; ii document.links$[$ii$]$.onfocus=function(){this.blur()} } 5.对WordPress可以用内部的JQuery框架来去除 $(&#8220;a&#8221;).bind(&#8220;focus&#8221;,function(){ if(this.blur){ this.blur(); } }); 转自：http://leotheme.cn/javascript/quediaolinksdesxk.html]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2010/06/remove-the-link-dashed-box/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>53 个CSS技巧</title>
		<link>http://www.junstudio.cn/2010/03/53-css-tips/</link>
		<comments>http://www.junstudio.cn/2010/03/53-css-tips/#comments</comments>
		<pubDate>Wed, 10 Mar 2010 15:22:22 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=748</guid>
		<description><![CDATA[1. CSS Based Navigation //基于CSS的导航 2. Navigation Matrix Reloaded //导航矩块翻转 3. CSS Tabs //CSS标签 4. CSS Bar Graphs //CSS条状图表 5. Collapsing Tables: An Example //压缩表格：一个实例 6. Adam’s Radio &#38; Checkbox Customisation Method //亚当的单选框和复选框的用户化方法 7. CSS Image Replacement //CSS图像替代 8. CSS Shadows(CSS Shadows Roundup) //CSS阴影（CSS阴影综述） 9. CSS Rounded Corners Roundup (Nifty Corners) //CSS 圆角综述（漂亮的拐角） 10. Drop [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2010/03/53-css-tips/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>精选30个国外优秀的CSS技术和实例</title>
		<link>http://www.junstudio.cn/2009/05/30-excellent-css-techniques-examples/</link>
		<comments>http://www.junstudio.cn/2009/05/30-excellent-css-techniques-examples/#comments</comments>
		<pubDate>Tue, 05 May 2009 08:26:54 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=427</guid>
		<description><![CDATA[1.Hoverbox 图片集 一个纯净的基于CSS的图片集，鼠标悬停缩略图就会显示放大效果。 2.高级CSS菜单 一款很有创意且复杂的CSS导航方案。 3.滑动影集 手风琴效果的影集，悬停便可拉伸图片。 4.Lightbox幻灯片 题为&#8221;Supercharge your image borders&#8220;的文章中的一部分展示了如何使用CSS样式让图片变得更有意思。 5.图片的阴影效果 在A List Apart上的一个关于图片效果Demo的讨论文章&#8220;CSS Drop shadows&#8220;. 6.跨浏览器多页式影集 悬停标签改变分类，悬停缩略图显示放大图。 7.CSS照片放大 使用简单的图片和background-position属性来进行调解。 8.CSS gallery layout&#8212;smells like a table 模仿表格布局，但使用的是列表。图集是流式宽度。 9.Sticky Footer 仅使用了很少XHTML的静态页脚。 10.whatever: hover 模仿Windows开始菜单的[url=/articles/tag/CSS]CSS[/url]导航菜单。 11.纯CSS手风琴效果 使用div和:hover伪类的手风琴效果，这个效果可以垂直显示也可以水平显示。 12.使用PNG和背景色的可扩展按钮 13.Pushbutton Links 链接在不使用图片的情况下看起来像个按钮。 14.含固定Header的可卷动表格 表格的标题被固定的优秀长表格。 15.CSS内容遮盖 当你悬停在图片上时，div容器会显示更多文字。 16.CSS样式表格版本2 一个使用背景图片且非常漂亮，被语义化标记的表格。 17.PNG遮盖 另一种为图片添加圆角的方法。（圆角、边框、阴影） 18.利用CSS为超链接添加提示 关于为不同类型的链接添加图标的简单教程。 19.简单的CSS圆角边框 仅适用了一张图片和很少的几行代码及标记。 20.Sitemap Celebration [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2009/05/30-excellent-css-techniques-examples/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>在IE6下选择文字异常问题</title>
		<link>http://www.junstudio.cn/2009/03/text-selection-problems-in-ie6/</link>
		<comments>http://www.junstudio.cn/2009/03/text-selection-problems-in-ie6/#comments</comments>
		<pubDate>Wed, 18 Mar 2009 01:07:41 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=440</guid>
		<description><![CDATA[IE6 存在两种文字选择异常问题： 1. 绝对定位下的不能选择文字，如下在IE中常常会碰到如果将容器定位后，出现容器内的文字不可选择。 xhtml结构： &#60;div&#62; &#60;a&#160;href=&#34;#&#34;&#62;定位后无法选择容器的内容解决方案&#60;/a&#62; &#60;/div&#62; css样式： div { &#160; &#160; position:absolute; &#160; &#160; top:100px; &#160; &#160; left:100px; &#160; &#160; width:200px; &#160; &#160; height:200px; &#160; &#160; border:1px&#160;solid red &#160; &#160; } HTML代码： &#60;div&#62; &#60;a&#160;href=&#34;#&#34;&#62;定位后无法选择容器的内容解决方案&#60;/a&#62; &#60;/div&#62; 请在IE中测试上面的代码，你会发现文字是无法选择的。 当时我想到的方法是在&#60;a href=&#34;#&#34;&#62;定位后无法选择容器的内容解决方案&#60;/a&#62;后面加上一个 空格来引发这个选择，不过这样的话就多了一个字符，不是很好。 是老外的，上面介绍的方法是通过 html, body{&#160; width:100%; height:100%; margin:0px; padding:0px; } 来解决问题 参考：http://www.webmasterworld.com/forum83/6565.htm 后来测试，只要保留height:100%就可以了。 第二种问题只是IE6下出现的，IE6不兼容写法，解决方法 我是在GOOGLE上搜索到的，参考老外解决方法：Base elements [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2009/03/text-selection-problems-in-ie6/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS网页布局开发小技巧</title>
		<link>http://www.junstudio.cn/2009/03/css-web-layout-of-the-development-tips/</link>
		<comments>http://www.junstudio.cn/2009/03/css-web-layout-of-the-development-tips/#comments</comments>
		<pubDate>Sun, 15 Mar 2009 15:08:32 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=348</guid>
		<description><![CDATA[在CSS网页布局开发中，会有很多小技巧，新手朋友往往对此很不熟悉。在某一两个小问题上，或许纠缠很长时间才能搞明白，虽然在webjx.com的文档中，多次提及过这方面的内容，但依然有很多朋友在这些问题上犯错。我们今天看看这些CSS技巧，认真读一读，或许您并不能完全理解，您可以在webjx.com进行搜索，扩展您所想要得到的知识，相信您会有很多收获！ 一、ul标签在Mozilla中默认是有padding值的，而在IE中只有margin有值。 二、同一个的class选择符可以在一个文档中重复出现，而id选择符却只能出现一次。对一个标签同时使用class和id进行CSS定义，如果定义有重复，id选择符做的定义有效，是因为id的权重要比class大。 三、一个兼容性调整(IE和Mozilla)的笨办法： 初学可能会碰到这样一个情况：同样一个标签的属性在IE设置成A显示是正常的，而在Mozilla里必须要设成B才能正常显示，或者两个倒过来。 临时解决方法：选择符{属性名:B !important;属性名:A} 或许有时候并没有效果。你可以在本站搜索更多的BUG解决方法。 四、如果一组要嵌套的标签之间需要些间距的话，那就留给位于里面的标签的margin属性吧，而不要去定义位于外面的标签的padding 五、li标签前面的图标推荐使用background-image，而不是list-style-image。 六、IE分不清继承关系和父子关系的差别，全部都是继承关系。 七、在给你的标签疯狂加选择符的时候，别忘了在CSS里给选择符加上注释。等你以后修改你的CSS的时候就知道为什么要这么做了。另外提醒您，不要太疯狂了。 八、如果你给一个标签设置了一个深色调的背景图片和亮色调的文字效果。建议这个时候给你的标签再设置一个深色调的背景颜色。因为图片丢失了，也可以保持文字的可读性。 九、定义链接的四种状态要注意先后顺序: Link Visited Hover Active(L-V-H-A) 十、与内容无关的图片请使用background。时刻记住表现与内容分离。 十一、定义颜色可以缩写#8899FF=#89F 十二、table在某些方面还是有用武之地的，在遇到内容为数据表格时，不要对它产生憎恨的心理。 十三、&#62;script>没有language这个属性，应该写成这样: 十四、完美的单象素外框线表格（在IE5、IE6、IE7及FF1.0.4以上中均可通过测试） table{ border-collapse:collapse; } td{ border:#000 solid 1px; } 十五、margin取负值可以在标签使用绝对定位的时候起到相对定位的作用，在页面居中显示时，使用绝对定位的层不适合使用left:XXpx这个属性。把这个层放到一个要相对定位的标签旁，然后使用margin的负值是个好方法。 十六、绝对定位时使用margin值定位可以达到相对于本身所在位置的定，这与top，left等属性相对与窗口边缘的定位不同。绝对定位的优势在于可以让其它元素忽略它的存在。 十七、如果文字过长,则将过长的部分变成省略号显示：IE5,FF无效，但可以隐藏，IE6有效 就是比如有一行文字，很长，表格内一行显示不下. 十八、在IE中可能由于注释带来的文字重复问题时可以把注释改为： Put your commentary in here… 十九、如何用CSS调用外部字体 语法： @font-face{font-family:name;src:url(url);sRules} 取值： name：字体名称。任何可能的 font-family 属性的值 url(url)：使用绝对或相对 url 地址指定OpenType字体文件 sRules：样式表定义 二十、如何让一个表单中的文本框中的文字垂直居中？ 如果用行高与高度的组在FF中是没有效果的，办法就是定义上下补白就可以实现想想的效果了。 二十一、定义A标签要注意的小问题： [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2009/03/css-web-layout-of-the-development-tips/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>15个优秀国外CSS框架</title>
		<link>http://www.junstudio.cn/2008/12/15-css-frameworks/</link>
		<comments>http://www.junstudio.cn/2008/12/15-css-frameworks/#comments</comments>
		<pubDate>Thu, 11 Dec 2008 14:01:22 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css frameworks]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=395</guid>
		<description><![CDATA[什么是css框架？ 实际上还是让我们从框架说起吧。 框架就是一个你可以用于你的网站项目的基本的概念上的结构体。 css框架通常只是一些css文件的集合，这些文件包括基本布局、表单样式、网格或简单结构、以及样式重置。比如： typography.css 基本排版规则 grid.css 基于网格的布局 layout.css 通常的布局 form.css for 表单样式 general.css 更多通用规则 下面一起来了解一下各种不同的CSS框架吧: 1 &#8211; 960 Grid System 960网格系统是一个通过提供通常使用的尺寸简化网站开发流程的努力的结果，基于960像素的页面宽度。它有两种类型，12和16列，他们可以独立使用或是协同使用。 2 &#8211; WYMstyle CSS Framework 这个项目的目的是提供一组经过良好测试的模块化的CSS文件，能够用于网站的快速设计。WYMstyle是一组CSS文件，你可以很容易的组合这些文件来快速的创建你的网站的布局。通过提供可靠的、经过良好测试的CSS模块，WYMstyle 力求让每个网站防止枯燥的跨浏览器兼容性测试。 3 &#8211; YAML CSS Framework Dirk Jesse的强大的(X)HTML/CSS框架为许多的简单或更复杂的网站项目提供完整的默认模板包。YAML基于网页标准并支持所有现代浏览器。所有的 Internet Explorer的主要渲染漏洞都被解决。YAML 完全支持从5.x到7.0的所有的IE版本。 4 &#8211; YUI Grids CSS 基本的YUI网格CSS提供4种预设的页宽、6种预设模板和再分为2、3、4卷的区块的功能。 这个4KB的文件可提供超过1000中页面布局组合。 有国外作者曾指出YUI Grids CSS中最值得学习的网格布局CSS写法: 负Margin技术 使用度量单位em 清除布局的浮动 5 &#8211; Logicss [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/12/15-css-frameworks/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>ISAPI rewrite中文手册</title>
		<link>http://www.junstudio.cn/2008/11/isapi-rewrite-cn-manual/</link>
		<comments>http://www.junstudio.cn/2008/11/isapi-rewrite-cn-manual/#comments</comments>
		<pubDate>Sun, 30 Nov 2008 14:25:27 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[rewrite]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=311</guid>
		<description><![CDATA[我们在进行网站搜索引擎优化（SEO）或在服务器进行防盗链设置的时候，可能会用到ISAPI rewrite，下面是ISAPI rewrite的手册，翻译成中文。 配置： 在NT 2000 XP和2003平台上，在系统帐户下应该INETINFO程序应该与IIS5以共存模式过滤器运行。所以系统帐户应该给予对所有的ISAPI- REWIRITE DLLS 和所有的HTTPD。INI文件至少可读权限，我们也推荐对给予系统帐户对于所有包括HTTPD。INI文件的文件夹的可写权限，这将允许产生HTTP。 PARSE。ERRORS文件，这些文件包含配置文件语法错误。对于PROXY模块也需要额外的权限，因为它将运行于连接池或HIGH-ISPLATED 应用模式，IIS帐户共享池和HIGH-ISOLATION池应被给予 对RWHELPERE。DLL的可读权限。缺省情况下IWAM-《计算机名》被用于所有的池，在相应的COM+应用设置中应借助 COM+ADMINISTRATION MMC SNAP-IN建立池帐户 配置文件格式化： 有两种形式的配置文件-GLOBAL（SERVER-LEVEL）和INDIVIDUAL（SITE-LEVAL） 文件，GLOBAL配置文件应被命名为HTTPD.INI并出现在ISAPI-REWRITE安装目录中，文件的快捷方式通过开始菜单提 供，INDIVIDUAL配置文件应名为HTTPD。INI并且能够出现在虚拟站点的物理根目录中，两种类型的格式化是相同的并是标准的WINDOWS。 INI文件，所有的指令都应该放在这一部分并且所有指令都应该以分隔线放置，任何这一部分以外的文本都将被忽略 HTTPD.INI文件示例 [ISAPI_Rewrite] # This is a comment # 300 = 5 minutes CacheClockRate 300 RepeatLimit 20 # Block external access to the httpd.ini and httpd.parse.errors files RewriteRule /httpd(?:\.ini&#124;\.parse\.errors) / [F,I,O] # Block external access [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/isapi-rewrite-cn-manual/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>em与px的区别以及em特点和应用</title>
		<link>http://www.junstudio.cn/2008/11/em-px-difference-between-characteristics-applications/</link>
		<comments>http://www.junstudio.cn/2008/11/em-px-difference-between-characteristics-applications/#comments</comments>
		<pubDate>Sun, 30 Nov 2008 13:43:35 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[em]]></category>
		<category><![CDATA[px]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=352</guid>
		<description><![CDATA[一直也搞不清楚px与em之间的关系和特点，看过95%的中国网站需要重写CSS以后后确实收获很大。平时都是用px来定义字体，所以无法用浏览器字体放大的功能，而国外大多数网站都可以在IE下使用。因为 1. IE无法调整那些使用px作为单位的字体大小； 2. 国外的大部分网站能够调整的原因在于其使用了em作为字体单位； 3. Firefox能够调整px和em，但是96%以上的中国网民使用IE浏览器(或内核)。 px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。(引自CSS2.0手册) em是相对长度单位。相对于当前对象内文本的字体尺寸。如当前对行内文本的字体尺寸未被人为设置，则相对于浏览器的默认字体尺寸。(引自CSS2.0手册) 任意浏览器的默认字体高都是16px。所有未经调整的浏览器都符合: 1em=16px。那么12px=0.75em, 10px=0.625em。为了简化font-size的换算，需要在css中的body选择器中声明Font-size=62.5%，这就使em值变为16px*62.5%=10px, 这样12px=1.2em, 10px=1em, 也就是说只需要将你的原来的px数值除以10，然后换上em作为单位就行了。 em有如下特点： 1. em的值并不是固定的； 2. em会继承父级元素的字体大小。 所以我们在写CSS的时候，需要注意两点： 1. body选择器中声明Font-size=62.5%； 2. 将你的原来的px数值除以10，然后换上em作为单位； 3. 重新计算那些被放大的字体的em数值。避免字体大小的重复声明。 也就是避免1.2 * 1.2= 1.44的现象。比如说你在#content中声明了字体大小为1.2em，那么在声明p的字体大小时就只能是1em，而不是1.2em, 因为此em非彼em，它因继承#content的字体高而变为了1em=12px。 但是12px汉字例外，就是由以上方法得到的12px(1.2em)大小的汉字在IE中并不等于直接用12px定义的字体大小，而是稍大一点。这个问题Jorux已经解决，只需在body选择器中把62.5%换成63%就能正常显示了。原因可能是IE处理汉字时，对于浮点的取值精确度有限。不知道有没有其他的解释。]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/em-px-difference-between-characteristics-applications/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS的渲染效率&#8212;-书写高效的CSS</title>
		<link>http://www.junstudio.cn/2008/11/css-efficiency/</link>
		<comments>http://www.junstudio.cn/2008/11/css-efficiency/#comments</comments>
		<pubDate>Sun, 30 Nov 2008 12:51:06 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css efficiency]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=350</guid>
		<description><![CDATA[根据一些CSS写作经验，如何提高渲染效率及所占用消耗的资源，我们来浅谈一下CSS的渲染效率，书写高效的CSS。 1、十六进制的颜色值对位数与大小写 编写十六进制颜色值时你可能会用小写字母或省略成3位数，关于这写法没找到确实的数据证明对浏览器的渲染效率是否有影响，但十六进制的颜色值默认标准是大写及6位数标注。在未知情况下不希望冒险而降低了渲染的效率。 * 不赞成 &#8211; color:#f3a; * 建议用 &#8211; color:#FF33AA; 2、display与visibility的差异 他们用于设置或检索是否显示对象。display隐藏对象不保留物理空间，visibility为隐藏对象保留占据的物理空间。当浏览器渲染被占据的物理空间时，会有所消耗资源。 * 不赞成 &#8211; visibility:hidden; * 建议用 &#8211; display:none; 3、border:none;与border:0;的区别 和display与visibility的关系类似，分别不保留与保留空间。更多的是border:0;尽管可以隐藏掉边框，但它会为你保留border-color/border-style的使用权。 * 不赞成 &#8211; border:0; * 建议用 &#8211; border:none; 4、不宜过小的背景图片平铺 一张宽高1px的背景图片，虽然文件体积非常之小，但渲染宽高500px的板块需要重复平铺2500次。提高背景图片渲染效率跟图片尺寸及体积有关，最大的图片文件体积保持约70KB。 * 不赞成 &#8211; 宽高8px以下的平铺背景图片 * 建议用 &#8211; 衡量适中体积及尺寸的背景图片 5、IE的滤镜 IE的滤镜除了比较消耗资源外也有兼容性问题。当中有令PNG透明的滤镜，可采用GIF或JPG似透非透的办法来避免使用此滤镜。建议只在IE6应用GIF透明，因为IE7以上已经支持了PNG透明。 * 不赞成，滥用IE滤镜因为消耗资源外也有兼容性问题。 * 建议用，最好选择其它方法能避免使用滤镜。 6、*{ margin:0; padding:0;}避免浏览器样式差异 *号通配符把所有标签都初始化一遍，浏览器的渲染消耗一定的资源。有部分在标签在不同浏览器上几乎无差异，或是某些已经不推荐使用的标签(因为你不会去用它)，它们不需通配符要重新初始化一遍这样做能节省一点资源。 * 不赞成，使用*号通配符 * 不赞成，div [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/css-efficiency/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>兼容IE6 position:fixed</title>
		<link>http://www.junstudio.cn/2008/11/ie6-position-fixed/</link>
		<comments>http://www.junstudio.cn/2008/11/ie6-position-fixed/#comments</comments>
		<pubDate>Sun, 30 Nov 2008 11:56:48 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[fixed]]></category>
		<category><![CDATA[position]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=356</guid>
		<description><![CDATA[IE6以下不能理解style = &#8220;position:fixed&#8221;, 所以我们要用javascript来兼容rubbish的它 我们要在js文件里写么，no，因为是IE，我们有更好的方式，那就是style.setExpression 也许应该这样 obj.style.setExpression(&#8216;top&#8216;,&#8217;document.body.scrollTop + 100&#8242;); 原理是这样 但是IE有很多bug， 1.含有scrolling offsets的表达式的值不会变，除非你把赋给一个变量 2.在strict模式下，需要给它一个 单位 ‘px’ 3.在strict模式下，应该用document.documentElement.scrollTop 来代替document.body.scrollTop 当你第一次看到如下代码，可能有点晕 obj.style.setExpression(&#8216;top&#8216;,&#34;(_=(document.body.scrollTop &#124;&#124; document.documentElement.scrollTop+ 100)) + &#8216;px&#8216; &#34;); 读了上面3条应该明白了 【参考文章】 1.www.howtocreate.co.uk/emails/TJSteed.html 2.www.javascriptkit.com/dhtmltutors/dynproperty4.shtml 【另附】 让你的页面在ie6也能玩position:fixed 跨浏览器的CSS固定定位{position:fixed} http://hi.baidu.com/suntear/blog/item/705b03233fafd14893580775.html 详解定位与定位应用 http://andymao.com/andy/post/70.html]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/ie6-position-fixed/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>【转】HTML属性以及相对应的CSS方法</title>
		<link>http://www.junstudio.cn/2008/11/html-to-the-css-method/</link>
		<comments>http://www.junstudio.cn/2008/11/html-to-the-css-method/#comments</comments>
		<pubDate>Fri, 28 Nov 2008 10:58:21 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[html]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=379</guid>
		<description><![CDATA[align=&#8221;left&#8221; HTML/CSS float:left; align=&#8221;right&#8221; HTML/CSS float:right; 使用CSS可以浮动 任何元素:图片、段落、div、标题、表格、列表等等 当你使用float属性，必须给这个浮动元素定义一个宽度。 marginwidth=&#8221;0&#8243; leftmargin=&#8221;0&#8243; marginheight=&#8221;0&#8243; topmargin=&#8221;0&#8243; HTML/CSS margin: 0; 使用CSS, margin可以设置在任何元素上, 不仅仅是body元素.更重要的，你可以分别指定元素的top, right, bottom和left的margin值。 vlink=&#8221;#333399&#8243; HTML/CSS a:hover:#999; alink=&#8221;#000000&#8243; HTML/CSS a:active:#00f; link=&#8221;#3333FF&#8221; HTML/CSS a:link: #3ff; 在HTML中，链接的颜色作为body的一个属性值定义。整个页面的链接风格都一样。使用CSS的选择器，页面不同部分的链接样式可以不一样。 bgcolor=&#8221;#FFFFFF&#8221; HTML/CSS background-color:#fff; 在CSS中，任何元素都可以定义背景颜色，不仅仅局限于body和table元素。 bordercolor=&#8221;#FFFFFF&#8221; HTML/CSS border-color:#fff; 任何元素都可以设置边框(boeder)，你可以分别定义top, right, bottom和left border=&#8221;3&#8243; HTML/CSS border-width:3px; 用CSS，你可以定义table的边框为统一样式，也可以分别定义top, right, bottom and left边框的颜色、尺寸和样式。 你可以使用 table, td or th [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/html-to-the-css-method/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS的优先权</title>
		<link>http://www.junstudio.cn/2008/11/css-conflict-resolve/</link>
		<comments>http://www.junstudio.cn/2008/11/css-conflict-resolve/#comments</comments>
		<pubDate>Fri, 28 Nov 2008 10:50:02 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=375</guid>
		<description><![CDATA[优先权问题其实就是一个冲突解决的问题，当同一个元素(或内容)被CSS选择符选中时，就要按照优先权取舍不同的CSS规则，这其中涉及到的问题其实很多。 首先就是CSS规则的specificity(特殊性)，CSS2.1有一套关于specificity的计算方式，用一个四位的数字串(CSS2是三位)来表示，最终specificity越高的规则越特殊，在优先级判定时也就越有优势。关于specificity的具体计算在各种情况下的数字加成有如下一般规则： 每个ID选择符(#someid)，加 0,1,0,0。 每个class选择符(.someclass)、每个属性选择符(形如[attr=””]等)、每个伪类(形如:hover等)加0,0,1,0 每个元素或伪元素(:firstchild)等，加0,0,0,1 其他选择符包括全局选择符*，加0,0,0,0。相当于没加，不过这也是一种specificity，后面会解释。 按这些规则将数字串逐位相加，就得到最终计算得的specificity，然后在比较取舍时按照从左到右的顺序逐位比较。 举一些例子吧： h1 {color: red;} /* 只有一个普通元素加成，结果是 0,0,0,1 */ body&#160;h1 {color: green;} /* 两个普通元素加成，结果是 0,0,0,2 */ ——后者胜出 h2.grape {color: purple;} /* 一个普通元素、一个class选择符加成，结果是 0,0,1,1*/ h2&#160;{color: silver;} /*一个普通元素，结果是 0,0,0,1 */ ——前者胜出 html &#62; body table tr[id=”totals”] td ul &#62; li {color: maroon;} /* 7个普通元素、一个属性选择符、两个其他选择符，结果是0,0,1,7 */ li#answer&#160;{color: navy;} /* 一个ID选择符，一个普通选择符，结果是0,1,0,1 */——后者胜出 [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/css-conflict-resolve/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>元素水平居中方案总结</title>
		<link>http://www.junstudio.cn/2008/11/horizontal-center-align/</link>
		<comments>http://www.junstudio.cn/2008/11/horizontal-center-align/#comments</comments>
		<pubDate>Thu, 27 Nov 2008 15:02:39 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[center]]></category>
		<category><![CDATA[水平居中]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=368</guid>
		<description><![CDATA[先来看我一个简单XHTML/HTML文件代码（部分），我们的目的是让#container水平居中。 &#60;body&#62; &#160; &#160; &#60;div&#160;id=&#34;container&#34;&#62; &#160; &#160; &#160; &#160; &#60;h1&#62;content&#60;/h1&#62; &#160; &#160; &#160; &#160; &#60;p&#62;Lorem ipsum dolor sit amet, consectetuer adipiscing elit.Phasellus varius eleifend.&#60;/p&#62; &#160; &#160; &#60;/div&#62; &#60;/body&#62; 使用自适应边界（auto margin） 水平居中任意元素的首选办法是使用边界（margin）性质（property），并把左右之值设置为auto。但你必须为#container指定一个宽度。 div#container { &#160; margin-left:&#160;auto; &#160; margin-right:&#160;auto; &#160; width:&#160;168px; } 这个方案在任何当代浏览器上都有效，即使是IE6，前提是在web标准兼容模式下（compliance mode）。不幸的是，它不会在先前版本的IE/Win中工作。我们为此列一个表格： 浏览的自适应边界支持一览表 浏览器 版本 支持 Internet Explorer 6.0, compliance mode 是 Internet Explorer 6.0, [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/horizontal-center-align/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>IE, FireFox, Opera 浏览器支持Alpha透明的方法</title>
		<link>http://www.junstudio.cn/2008/11/the-way-to-support-the-alpha-transparent-in-ie-firefox-opera-browser/</link>
		<comments>http://www.junstudio.cn/2008/11/the-way-to-support-the-alpha-transparent-in-ie-firefox-opera-browser/#comments</comments>
		<pubDate>Thu, 27 Nov 2008 12:40:00 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[透明]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=366</guid>
		<description><![CDATA[先请看如下代码： filter:alpha(opacity=50); /* IE */ -moz-opacity:0.5; /* Moz + FF */ opacity: 0.5; /* 支持CSS3的浏览器（FF 1.5也支持）*/ 简单解释，IE使用私有属性filter:alpha(opacity)，Moz Family使用私有属性-moz-opacity，而标准的属性是opacity（CSS 3, Moz Family部分支持CSS3）。后面的数值是透明度，使用百分比或者小数（alpha(opacity)）使用大于0小于100的数值，其实也是百分比）。 从上面的代码中你没有看到Opera。没错，Opera还未支持标准的opacity，也没有其私有的可支持Alpha透明的属性。 但是，我们知道，Opera是支持Alpha透明的PNG图片的（当然Moz Family也支持）。所以我们可以使用背景图片来实现Alpha透明效果。 关键在于： background: transparent url(alpha80.png) left top repeat!important; background: #ccc; filter:alpha(opacity=50); 既然Moz Family支持Alpha透明的PNG，所以我们没有必要使用其私有属性了。当然，你可以使用标准的opacity，但别同时使用Alpha透明图片和opacity，这样的话就成了两者的混合了。你可以把上面的例子下载过来，然后/*opacity: .5;*/的注释看看。]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/the-way-to-support-the-alpha-transparent-in-ie-firefox-opera-browser/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>让max-*, min-*在IE6中有效的解决方案</title>
		<link>http://www.junstudio.cn/2008/11/max-min-ie6-support-solution/</link>
		<comments>http://www.junstudio.cn/2008/11/max-min-ie6-support-solution/#comments</comments>
		<pubDate>Thu, 27 Nov 2008 12:17:20 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[ie6]]></category>
		<category><![CDATA[max]]></category>
		<category><![CDATA[min]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=361</guid>
		<description><![CDATA[max-width、max-height、min-width和min-height这四个性质（property）分别表示最大宽度、最大高度、最小宽度和最小高度。它们在CSS中有着很重要的作用，比如，它们可以用来很好地协调各种不同分辨率下用户端（client）的显示效果，举个例子，你设计的网页由于侧栏（sidebar）过宽，当用户使用640*480或者更小的分辨率浏览网页的话，就会导致内容（content）栏过窄，影响用户的阅读，一个办法是，把内容或者包含内容的div的宽度固定一个最小值，姑且是780px吧，那么我们可以这样写：min-width: 780px;，这样，当用户端分辨率的宽度在小于780px时，会在水平位置上出现滚动条，不至于影响布局，用户稍微移动一下滚动条就可以方便阅读主要内容。 然后，十分不幸的是，你知道我要说什么，就是IE，这个世界上使用者最多的浏览器，到目前的版本为止，对这四个性质没有一个能够，哪怕一点点的支持。这可让设计者吃尽了苦头，最明显的就是，当你使用float布局时，在IE中的一个臭毛病是，顶层div的宽度变小的时候（缩小窗口，分辨率低等），浮动的布局（一般是右边那一块跑到了下方）就会被破坏，变得一塌糊涂。这样即使是最开明的主管，也不能容忍你这样的设计…… 天生不足，后天补上。web设计世界的天才多如牛毛，我们随便Google就能找到不少解决方案（solution），在抱怨IE的同时请向西半球鞠躬。当我写到这里时，我才开始一一验证我所找到的方案，结果让我大失所望，令另我把标题从“让max-*, min-*在IE中有效的解决方案”改成了“让max-*, min-*在IE6中有效的解决方案”。真如Dave所说：别指望 min-width 在IE中有用。 我找到的第一种方案，在http://www.issociate.de/board/post/154073/min-width.html中说，可以在同层的div中加入例如 &#60;div style=&#8221;width: 300px; height: 0; line-height:0;&#62;&#60;/div&#62;。可惜，这种无异于插入空白占位透明的GIF图片（spacer GIF）无异，没有实际的效果和意义。诸君可以亲自一试…… 第二种，请访问http://www.svendtofte.com/code/max_width_in_ie/，此人研究JavaScript极为深入，在CSS中使用了极为罕用的expression，虽然这会让CSS文件通不过校验（validation），但是我觉得，标准的意义在于分离结构和表现，而且未影响到XHTML/HTML的代码合法性，可以接受。我曾欢天喜地啊，因为我用IE各种版本测试了他的演示版（demo）均正常无比……我自己写的在IE 5.x中也测试通过，最后，在IE6中测试的时候，IE6竟然当掉（crash）了。不解，极为痛苦……仔细检查代码，原来他的demo没有任何DTD声明（即&#60;!DOCTYPE html PUBLIC &#8220;-//W3C//DTD XHTML 1.0 Strict//EN&#8221; &#8220;http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd&#8221;&#62;这样的声明），莫非此方法只可以在怪癖模式（quirks mode）下起作用？我把我的HTML文件中的DTD去掉，果如其然。真是一个极大讽刺，想在标准下使用CSS却不能在标准下使用XHTML/HTML……这个方法，嗯，假如你的网页在quirks mode下使用，可以使用这个方法……但是，在IE 5.x下可以使用，无论是标准模式（standard mode）还是怪癖模式下。具体方法在其网页上，在此不列出。 第三种方案，恰恰相反，在IE6中十分完美，而且也不用担心CSS代码的合法性。请访问http://www.doxdesk.com/software/js/minmax.html。不像作者所说，可以支持非mac版的IE 5以上版本（make IE5+/Win support CSS min/max-width/height）,我的测试结果，只有IE6起作用，而且十分完美。如果你的网页已经不再面向IE5.x，这个方法就是拯救你的灵丹妙药。方法十分简单，请下载http://www.doxdesk.com/file/software/js/minmax.js，在head区域添加 就可以了。 从此，在IE6完全淘汰之前，你可以部分指望 min-width在IE6中有用了。还有什么更好的办法，请留言，谢谢。]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/max-min-ie6-support-solution/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>完整的CSS工具列表</title>
		<link>http://www.junstudio.cn/2008/11/full-css-tool-list/</link>
		<comments>http://www.junstudio.cn/2008/11/full-css-tool-list/#comments</comments>
		<pubDate>Sun, 09 Nov 2008 12:24:29 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[tool]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=295</guid>
		<description><![CDATA[用户界面 I Like Your Color 输入URL然后它会抓出其中的颜色并用16进制表示。 CSS Multi-element Rollover Generator 使用CSS和一个图片创建出一个翻转按钮的样式。 CSS Rounded Box Generator Ruthsarian Layouts 6个CSS页面布局模板，包括颜色、标题等。 Bluerobot Layout Reservoir 2栏和3栏的CSS布局框架 Glish CSS Layout techniques 2、3、 4栏的CSS布局框架 The Layout-o-matic 输入页宽、栏数和padding，它会自动生成CSS和HTML的布局框架。 Little Boxes w3cn.org上提供的那些布局模板 Open Source Web Design 各种免费的完整页面模板 Web Builders&#8217; Toolkit 更多的模版资源 Iconico Online CSS Scrollbar Color Changer List-u-Like 一个CSS菜单生成器：轻松创建采用li并兼容各种浏览器的导航菜单。 Nifty Corners: 无需图片的圆角矩形 Round [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/full-css-tool-list/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>网页标准化-CSS命名规划整理</title>
		<link>http://www.junstudio.cn/2008/11/web-standardization-css-standardized-naming/</link>
		<comments>http://www.junstudio.cn/2008/11/web-standardization-css-standardized-naming/#comments</comments>
		<pubDate>Wed, 05 Nov 2008 03:23:06 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[tip]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=286</guid>
		<description><![CDATA[(一) 常用的CSS命名规则： 头：header 内容：content/container 尾：footer 导航：nav 侧栏：sidebar 栏目：column 页面外围控制整体布局宽度：wrapper 左右中：left\right\center 登录条：loginbar 标志：logo 广告：banner 页面主体：main 热点：hot 新闻：news 下载：download 子导航：subnav 菜单：menu 子菜单：submenu 搜索：search 友情链接：friendlink 页脚：footer 版权：copyright 滚动：scroll 内容：content 标签页：tab 文章列表：list 提示信息：msg 小技巧：tips 栏目标题：title 加入：joinus 指南：guild 服务：service 注册：regsiter 状态：status 投票：vote 合作伙伴：partner (二) 注释的写法： /*Footer*/ 内容区 /*EndFooter*/ (三) id的命名： (1)页面结构 容器：container 页头：header 内容：content/container 页面主体：main 页尾：footer 导航：nav 侧栏：sidebar 栏目：column 页面外围控制整体布局宽度：wrapper [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/web-standardization-css-standardized-naming/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>开源JS菜单收藏&#8212;&#8211;JSCookMenu</title>
		<link>http://www.junstudio.cn/2008/11/open-source-js-menu-collection-jscookmenu/</link>
		<comments>http://www.junstudio.cn/2008/11/open-source-js-menu-collection-jscookmenu/#comments</comments>
		<pubDate>Mon, 03 Nov 2008 14:41:13 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[js]]></category>
		<category><![CDATA[JSCookMenu]]></category>
		<category><![CDATA[menu]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=284</guid>
		<description><![CDATA[JSCookMenu的作者是一个在美的中国留学生－－－袁衡。中国人发起的开源项目不多，能被广泛使用的就更少了，这也是当初吸引我的一个地方。 JSCookMenu目前最新的版本是2.0.3，大家可以到其站点http://jscook.yuanheng.org下载最新版本。以下主要介绍其用法。 首先，先下载其最新版本的Core代码，将其解压后，得到两个JS文件：JSCookMenu.js 和 effect.js，再下载其皮肤文件，JSCookMenu目前提供三种皮肤样式：ThemeGray，ThemeOffice2003，ThemePanel，将其下载后，解压。 下载：http://sourceforge.net/project/showfiles.php?group_id=149372]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/open-source-js-menu-collection-jscookmenu/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Using CSS to Fix Anything: 20+ Common Bugs and Fixes</title>
		<link>http://www.junstudio.cn/2008/11/using-css-to-fix-anything-20-common-bugs-and-fixes/</link>
		<comments>http://www.junstudio.cn/2008/11/using-css-to-fix-anything-20-common-bugs-and-fixes/#comments</comments>
		<pubDate>Sun, 02 Nov 2008 06:09:31 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[bug]]></category>
		<category><![CDATA[fix]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=262</guid>
		<description><![CDATA[Without a doubt, a logical and structured layout is the best way to go. Not only because your layout varies between browsers, but also because CSS has a lot of ways to position every element you have. Today we wanted to share with you some quick tips on how to avoid easy pitfalls when creating [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/using-css-to-fix-anything-20-common-bugs-and-fixes/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS无所不能：50多个创造性实例讲解</title>
		<link>http://www.junstudio.cn/2008/11/css%e6%97%a0%e6%89%80%e4%b8%8d%e8%83%bd%ef%bc%9a50%e5%a4%9a%e4%b8%aa%e5%88%9b%e9%80%a0%e6%80%a7%e5%ae%9e%e4%be%8b%e8%ae%b2%e8%a7%a3/</link>
		<comments>http://www.junstudio.cn/2008/11/css%e6%97%a0%e6%89%80%e4%b8%8d%e8%83%bd%ef%bc%9a50%e5%a4%9a%e4%b8%aa%e5%88%9b%e9%80%a0%e6%80%a7%e5%ae%9e%e4%be%8b%e8%ae%b2%e8%a7%a3/#comments</comments>
		<pubDate>Sat, 01 Nov 2008 15:49:19 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=217</guid>
		<description><![CDATA[CSS有很强的能力创造大量丰富而独特的技术，有很多创造性的手法和技巧 样式列表 The Amazing &#60;li&#62; &#8211; 用一小段CSS，“&#60;li&#62;”在一个WEB设计师的手里就变成了许多很丰富和多功能的标签。这篇文章就是j教你如何使用和称赞这个令人惊奇的“&#60;li&#62;”标签。 所以现在就开始吧.. Better Ordered Lists (Using Simple PHP and CSS) &#8211; 在你需要摆脱传统表单列表来创造一个属于自己的风格的时候，这就是一个简单的例子。 Style Your Ordered List &#8211; 这里是一个简短的CSS教程,教你如何使用表单“&#60;ol&#62;”标签和“&#60;P&#62;”标签来设计一个有风格的number list 。 在线演示：演示地址 下载地址：zip格式 List Based Calendar &#8211; 一个简单的方法给日历增加视觉样式，所以你只能看到在这个月历格式只是一个简单的列表。 在线演示：演示地址 FORM表单及原理 Datasheet-style form using HTML and CSS &#8211; 使用HTML,CSS和JavaScript来制作书库表WEB页面的许多像似的方法, Styling File Inputs with CSS and the Dom &#8211; 上传表单(&#60;input type=&#8221;file&#8221; /&#62;) [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/11/css%e6%97%a0%e6%89%80%e4%b8%8d%e8%83%bd%ef%bc%9a50%e5%a4%9a%e4%b8%aa%e5%88%9b%e9%80%a0%e6%80%a7%e5%ae%9e%e4%be%8b%e8%ae%b2%e8%a7%a3/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>CSS框架 &#8211; blueprint(蓝图)</title>
		<link>http://www.junstudio.cn/2008/08/css-framework-blueprint/</link>
		<comments>http://www.junstudio.cn/2008/08/css-framework-blueprint/#comments</comments>
		<pubDate>Sat, 02 Aug 2008 01:37:03 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[css frameworks]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=149</guid>
		<description><![CDATA[blueprint(蓝图)是一个CSS框架，其目的是减少对你的CSS开发时间。 http://code.google.com/p/blueprintcss/]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/08/css-framework-blueprint/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>基于AJAX,CSS的TAB插件</title>
		<link>http://www.junstudio.cn/2008/07/ajax-css-tab-based-interfaces/</link>
		<comments>http://www.junstudio.cn/2008/07/ajax-css-tab-based-interfaces/#comments</comments>
		<pubDate>Thu, 17 Jul 2008 11:28:41 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[AJAX]]></category>
		<category><![CDATA[TAB]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=96</guid>
		<description><![CDATA[1) Easy Tabs 1.2 with autochange- 你现在就可以设置一个属于那你的自动播放式菜单 2) Rotating jQuery tabs基于Jquery的自动表放Tab 3) Slideshow Tab Content Script-&#8221;- 支持“幻灯片演示”模式，在这种脚本自动循环通过并选择每个标签的定期，直到一个标签是明确选定的。 4) Sliding Tabs 5) Coda-Slider- 6) Perspective tabs AJAX内容标签 7) Ajax Tabs Content Script这是一个多功能的AJAX标签内容的脚本 可关闭的TAB标签 8 ) Tab Panes关闭和添加面板两个版本 9) Closeable Tabs Module Closeable 标签有可以关闭标签的小叉叉。 不可不看的例子 10) Fabtabulous 使用Prototype的简单标签 11) 又是一个Jquery制作的TAB标签,内容部分有淡入淡出的效果 12) moo.fx Tab Accordion基于moo.fx的手风琴效果的标签 13) MooTabs- MooTools是基于MooTools的类,而且很小,3KB,正如它的名字,他的主要的作用是做个简单的导航标签帮助 [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/07/ajax-css-tab-based-interfaces/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>基于FORM的CSS样式：很现代的解决办法</title>
		<link>http://www.junstudio.cn/2008/07/form-css-modern-solutions/</link>
		<comments>http://www.junstudio.cn/2008/07/form-css-modern-solutions/#comments</comments>
		<pubDate>Sun, 13 Jul 2008 09:50:42 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[CSS Form]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=67</guid>
		<description><![CDATA[Developing Forms Prettier Accessible Forms The Form Assembly &#8211; Form Layouts CSS Styling of forms, Stu Nicholls Semantic Horizontal Forms Trimming form fields Badboy Niceforms Functional Pretty Forms CSS-Only, Table-less Forms Accessible Forms Subtraction: Free Form for All &#8211; Standardkonforme Online-Formulare Accessible CSS Forms Form Layout Templates Style Web Forms Using CSS Form Help without [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/07/form-css-modern-solutions/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>CSS浏览器兼容方案 &#8211; hack</title>
		<link>http://www.junstudio.cn/2008/07/browser-compatibility-css-hack/</link>
		<comments>http://www.junstudio.cn/2008/07/browser-compatibility-css-hack/#comments</comments>
		<pubDate>Tue, 01 Jul 2008 13:39:55 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[CSS]]></category>
		<category><![CDATA[hack]]></category>

		<guid isPermaLink="false">http://www.junstudio.cn/?p=59</guid>
		<description><![CDATA[1、仅IE7与IE5.0可以识别 *+html select {…} 当面临需要只针对IE7与IE5.0做样式的时候就可以采用这个HACK。 2、仅IE7可以识别 *+html select {…!important;} 当面临需要只针对IE7做样式的时候就可以采用这个HACK。 3、IE6及IE6以下识别 * html select {…} 这个地方要特别注意很多博客都写成了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。 4、html/**/ >body select {…} html/**/ &#62;body select {…} 这句与上一句的作用相同。 5、仅IE6不识别，屏蔽IE6 select { display /*屏蔽IE6*/:none;} 这里主要是通过CSS注释分开一个属性与值，注释在冒号前。 6、仅IE6与IE5不识别，屏蔽IE6与IE5 select/**/ { display /*IE6,IE5不识别*/:none;} 这里与上面一句不同的是在选择符与花括号之间多了一个CSS注释。不屏蔽IE5.5 7、仅IE5不识别，屏蔽IE5 select/*IE5不识别*/ {…} 这一句是在上一句中去掉了属性区的注释。只有IE5不识别，IE5.5可以识别。 8、盒模型解决方法 selct {width:IE5.x宽度; voice-family :”\”}\”&#34;; voice-family:inherit; width:正确宽度;} 盒模型的清除方法不是通过!important来处理的。这点要明确。 9、只有Opera识别 @media all and (min-width: 0px){ [...]]]></description>
		<wfw:commentRss>http://www.junstudio.cn/2008/07/browser-compatibility-css-hack/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>
