<?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>Yooyo Garden &#187; css front-end</title>
	<atom:link href="http://www.yooyo.me/blog/tag/css-front-end/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.yooyo.me/blog</link>
	<description>frent-end  and web design</description>
	<lastBuildDate>Thu, 10 Nov 2011 04:43:17 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3</generator>
		<item>
		<title>css 文字换行解决方案</title>
		<link>http://www.yooyo.me/blog/css-%e6%96%87%e5%ad%97%e6%8d%a2%e8%a1%8c%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/</link>
		<comments>http://www.yooyo.me/blog/css-%e6%96%87%e5%ad%97%e6%8d%a2%e8%a1%8c%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/#comments</comments>
		<pubDate>Sat, 06 Mar 2010 18:30:51 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[前端开发]]></category>
		<category><![CDATA[css front-end]]></category>

		<guid isPermaLink="false">http://www.yooyo.me/blog/css-%e6%96%87%e5%ad%97%e6%8d%a2%e8%a1%8c%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/</guid>
		<description><![CDATA[word-wrap:break-word; overflow:hidden; 　　这种最好的方式，在 IE 下没有任何问题，在 FF 下，长串英文会被遮住超出的内容。 　　技术总结： 　　word-wrap是控制换行的。 　　使用break-word时，是将强制换行。中文没有任何问题，英文语句也没问题。但是对于长串的英文，就不起作用。 　　break-word是控制是否断词的。 　　normal是默认情况，英文单词不被拆开。 　　break-all，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。 　　keep-all，是指Chinese, Japanese, and Korean不断词。即只用此时，不用word-wrap，中文就不会换行了。（英文语句正常。） 　　IE下： 　　使用word-wrap:break-word;所有的都正常。 　　FireFox下： 　　如这2个都不用的话，中文不会出任何问题。英文语句也不会出问题。但是，长串英文会出问题。 　　为了解决长串英文，一般用word-wrap:break-word;word- break:break-all;。但是，此方式会导致，普通的英文语句中的单词会被断开（IE下也是）。 　　用：overflow:auto; IE下，长串会自动折行。FireFox下，长串会被遮盖。 　　所以，我们用word-wrap:break- word;overflow:hidden;]]></description>
			<content:encoded><![CDATA[<p>        word-wrap:break-word; overflow:hidden;</p>
<p>　　这种最好的方式，在 IE 下没有任何问题，在 FF 下，长串英文会被遮住超出的内容。</p>
<p>　　技术总结：</p>
<p>　　word-wrap是控制换行的。</p>
<p>　　使用break-word时，是将强制换行。中文没有任何问题，英文语句也没问题。但是对于长串的英文，就不起作用。</p>
<p>　　break-word是控制是否断词的。</p>
<p>　　normal是默认情况，英文单词不被拆开。</p>
<p>　　break-all，是断开单词。在单词到边界时，下个字母自动到下一行。主要解决了长串英文的问题。</p>
<p>　　keep-all，是指Chinese, Japanese, and Korean不断词。即只用此时，不用word-wrap，中文就不会换行了。（英文语句正常。）</p>
<p>　　IE下：</p>
<p>　　使用word-wrap:break-word;所有的都正常。</p>
<p>　　FireFox下：</p>
<p>　　如这2个都不用的话，中文不会出任何问题。英文语句也不会出问题。但是，长串英文会出问题。</p>
<p>　　为了解决长串英文，一般用word-wrap:break-word;word- break:break-all;。但是，此方式会导致，普通的英文语句中的单词会被断开（IE下也是）。</p>
<p>　　用：overflow:auto; IE下，长串会自动折行。FireFox下，长串会被遮盖。</p>
<p>　　所以，我们用word-wrap:break- word;overflow:hidden;</p>
]]></content:encoded>
			<wfw:commentRss>http://www.yooyo.me/blog/css-%e6%96%87%e5%ad%97%e6%8d%a2%e8%a1%8c%e8%a7%a3%e5%86%b3%e6%96%b9%e6%a1%88/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

