<?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>落脚点 &#187; CSS</title>
	<atom:link href="http://www.zhanggy.com/tag/css/feed" rel="self" type="application/rss+xml" />
	<link>http://www.zhanggy.com</link>
	<description></description>
	<lastBuildDate>Fri, 27 Jan 2012 06:13:57 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>css实现强制不换行/自动换行/强制换行</title>
		<link>http://www.zhanggy.com/blog/css%e5%ae%9e%e7%8e%b0%e5%bc%ba%e5%88%b6%e4%b8%8d%e6%8d%a2%e8%a1%8c-%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c-%e5%bc%ba%e5%88%b6%e6%8d%a2%e8%a1%8c</link>
		<comments>http://www.zhanggy.com/blog/css%e5%ae%9e%e7%8e%b0%e5%bc%ba%e5%88%b6%e4%b8%8d%e6%8d%a2%e8%a1%8c-%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c-%e5%bc%ba%e5%88%b6%e6%8d%a2%e8%a1%8c#comments</comments>
		<pubDate>Mon, 23 May 2011 05:10:25 +0000</pubDate>
		<dc:creator>zhanggy</dc:creator>
				<category><![CDATA[Web building]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.zhanggy.com/?p=724</guid>
		<description><![CDATA[强制不换行 div{ white-space:nowrap; } 自动换行 div{ word-wrap: break-word; word-break: normal; } 强制英文单词断行 div{ word-break:break-all; }]]></description>
		<wfw:commentRss>http://www.zhanggy.com/blog/css%e5%ae%9e%e7%8e%b0%e5%bc%ba%e5%88%b6%e4%b8%8d%e6%8d%a2%e8%a1%8c-%e8%87%aa%e5%8a%a8%e6%8d%a2%e8%a1%8c-%e5%bc%ba%e5%88%b6%e6%8d%a2%e8%a1%8c/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Clean and pure CSS FORM design</title>
		<link>http://www.zhanggy.com/blog/clean-and-pure-css-form-design</link>
		<comments>http://www.zhanggy.com/blog/clean-and-pure-css-form-design#comments</comments>
		<pubDate>Mon, 09 Jun 2008 17:14:36 +0000</pubDate>
		<dc:creator>zhanggy</dc:creator>
				<category><![CDATA[Web building]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.zhanggy.com/?p=134</guid>
		<description><![CDATA[From:Clean and pure CSS FORM design HTML Code: &#60;div id=&#34;stylized&#34; class=&#34;myform&#34;&#62;&#60;form id=&#34;form&#34; name=&#34;form&#34; method=&#34;post&#34; action=&#34;index.html&#34;&#62;&#60;h1&#62;Sign-up form&#60;/h1&#62;&#60;p&#62;This is the basic look of my form without table&#60;/p&#62;&#160;&#60;label&#62;Name&#60;span class=&#34;small&#34;&#62;Add your name&#60;/span&#62;&#60;/label&#62;&#60;input type=&#34;text&#34; name=&#34;name&#34; id=&#34;name&#34; /&#62;&#160;&#60;label&#62;Email&#60;span class=&#34;small&#34;&#62;Add a valid address&#60;/span&#62;&#60;/label&#62;&#60;input type=&#34;text&#34; name=&#34;email&#34; id=&#34;email&#34; /&#62;&#160;&#60;label&#62;Password&#60;span class=&#34;small&#34;&#62;Min. size 6 chars&#60;/span&#62;&#60;/label&#62;&#60;input type=&#34;text&#34; name=&#34;password&#34; id=&#34;password&#34; /&#62;&#160;&#60;button type=&#34;submit&#34;&#62;Sign-up&#60;/button&#62;&#60;div class=&#34;spacer&#34;&#62;&#60;/div&#62;&#160;&#60;/form&#62;&#60;/div&#62; CSS Code: body{font-family:&#34;Lucida Grande&#34;, &#34;Lucida [...]]]></description>
		<wfw:commentRss>http://www.zhanggy.com/blog/clean-and-pure-css-form-design/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>免费的CSS模板</title>
		<link>http://www.zhanggy.com/blog/nice-and-free-css-templates</link>
		<comments>http://www.zhanggy.com/blog/nice-and-free-css-templates#comments</comments>
		<pubDate>Mon, 04 Feb 2008 06:37:03 +0000</pubDate>
		<dc:creator>zhanggy</dc:creator>
				<category><![CDATA[Web building]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[free]]></category>

		<guid isPermaLink="false">http://www.zhanggy.com/blog/nice-and-free-css-templates</guid>
		<description><![CDATA[常用的免费的CSS模板样式： Menu und content dynamic Menu fixed, content dynamic Menu und content dynamic 3 columns all dynamic 4 columns all dynamic Menu floating Menu fix, Inhalt u. Head dynamic 3 columns fix centered dynamic mit Head und Footer fixed BOX centered dynamic BOX centered fixed Box total centered]]></description>
		<wfw:commentRss>http://www.zhanggy.com/blog/nice-and-free-css-templates/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>CSS清理和压缩工具</title>
		<link>http://www.zhanggy.com/blog/23-resources-for-clean-and-compressed-css</link>
		<comments>http://www.zhanggy.com/blog/23-resources-for-clean-and-compressed-css#comments</comments>
		<pubDate>Tue, 29 Jan 2008 13:40:01 +0000</pubDate>
		<dc:creator>zhanggy</dc:creator>
				<category><![CDATA[Web building]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.zhanggy.com/blog/23-resources-for-clean-and-compressed-css</guid>
		<description><![CDATA[原文：23 Resources for Clean and Compressed CSS There are a number of free online tools that can help you to create and maintain effective [tag]CSS[/tag] coding. These tools include validators, optimizers, compressors and more. Try out a few of these tools and see how they can help you to keep more efficient style sheets. CSS [...]]]></description>
		<wfw:commentRss>http://www.zhanggy.com/blog/23-resources-for-clean-and-compressed-css/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>用css实现表格隔行颜色不一样的效果</title>
		<link>http://www.zhanggy.com/blog/css-table-color</link>
		<comments>http://www.zhanggy.com/blog/css-table-color#comments</comments>
		<pubDate>Sun, 23 Dec 2007 07:10:19 +0000</pubDate>
		<dc:creator>zhanggy</dc:creator>
				<category><![CDATA[Web building]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Javascript]]></category>

		<guid isPermaLink="false">http://www.zhanggy.com/?p=101</guid>
		<description><![CDATA[这里用到了javascript，简单的实现表格隔行颜色的不同，方法还有很多，不过用javascript能够很好的跨浏览器兼容，具体代码如下： &#60;!DOCTYPE HTML PUBLIC &#34;-//W3C//DTD HTML 4.0 Transitional//EN&#34;&#62; &#60;HTML&#62; &#60;HEAD&#62; &#60;TITLE&#62; New Document &#60;/TITLE&#62; &#60;META NAME=&#34;Generator&#34; CONTENT=&#34;EditPlus&#34;&#62; &#60;META NAME=&#34;Author&#34; CONTENT=&#34;&#34;&#62; &#60;META NAME=&#34;Keywords&#34; CONTENT=&#34;&#34;&#62; &#60;META NAME=&#34;Description&#34; CONTENT=&#34;&#34;&#62; &#60;/HEAD&#62; &#60;BODY&#62; &#60;style&#62; tr.light { background-color: #33FFCC; } tr.dark{ background-color: #3366FF; } &#60;/style&#62; &#60;script&#62; function initTableCss(){ var tab=document.getElementById( &#34;table&#34;); for(var i=0;i &#60;tab.rows.length;i++){ tab.rows[i].className=(i%2==1)? &#34;light&#34;: &#34;dark&#34;; } } window.onload=initTableCss; &#60;/script&#62; [...]]]></description>
		<wfw:commentRss>http://www.zhanggy.com/blog/css-table-color/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>理解position:relative 与 position:absolute</title>
		<link>http://www.zhanggy.com/blog/understand-position-relative-and-position-absolute</link>
		<comments>http://www.zhanggy.com/blog/understand-position-relative-and-position-absolute#comments</comments>
		<pubDate>Sun, 16 Dec 2007 14:25:38 +0000</pubDate>
		<dc:creator>zhanggy</dc:creator>
				<category><![CDATA[Web building]]></category>
		<category><![CDATA[comparison]]></category>
		<category><![CDATA[CSS]]></category>

		<guid isPermaLink="false">http://www.zhanggy.com/?p=99</guid>
		<description><![CDATA[注：本文转载自http://vanivan.com/atom.asp?cateID=1 position 有三个值，static（静态）、relative（相对）、absolute（绝对）；由于static是所有页面元素的默认值，因此设置元素的定位类型时几乎不用这个值，除非用于覆盖之前的定义。对于后两者，一般应用：在一个相对定位的元素里面放置一个绝对定位的元素，如图： 子元素B可以通过top、right、bottom、left来精确定位，定位的参考目标就是其具有相对定位属性的父级元素A；并且设置这些偏移后，产生的空隙会被后面的元素填充（如果后面的元素足够尺寸的话）。由于B元素具有absolute定位属性，相当于从文档流中抽取出来，浮动在原平面排版上，形成 “层”，如果有多个“层”，层与层之间就必然会有谁覆盖谁，谁在上谁在下的竞争关系，因此，为解决这个竞争，就产生了 z-index（空间坐标系的Z轴）属性，谁的值大，谁就在上面。另外，如果父级元素A没有设置relative，那么B元素就会以body标签当作参考点。 对于具有 position:relative属性的元素A，其top、right、bottom、left四个方向的位置偏移就会以该元素的原来位置作为参考点，而不是像上面说的，以具有relative定位属性的父级元素或body作为参考点。在设置了偏移后产生了空隙，其周围的元素并不会填充这些空隙，即使它们足够尺寸(演示)。 &#60;!DOCTYPE HTML PUBLIC &#34;-//W3C//DTD HTML 4.0 Transitional//EN&#34;&#62; &#60;HTML&#62; &#60;HEAD&#62; &#60;TITLE&#62; Position:relative &#60;/TITLE&#62; &#60;style type=&#34;text/css&#34;&#62; ul { list-style-type:none; height:300px;margin:0px; width:300px} li { width:100px; text-align:center; float:left;height:100px; line-height:100px} #position { width:40px} .csstext { padding:6px; background-color:#ccc;border:1px solid #999; margin:10px 0px; height:auto; line-height:20px; color:blue} &#60;/style&#62; &#60;script&#62; function po(){ document.getElementById('testid').style.position='relative'; // document.getElementById(&#34;testid&#34;).style.filter=&#34;Alpha(Opacity=80)&#34;; } [...]]]></description>
		<wfw:commentRss>http://www.zhanggy.com/blog/understand-position-relative-and-position-absolute/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

