字符串截取的幾種辦法（php，js，css三種）

可能沒什麼含量，求少拍磚。
首先是PHP版本的。

<?php echo mb_strimwidth("這裏是內容", 0,3,"...","utf-8"); ?>

其實只用mb_strimwidth一個函數就能夠了，該函數的說明以下：
mb_strimwidth — 獲取按指定寬度截斷的字符串
string mb_strimwidth ( string $str , int $start , int $width [, string $trimmarker = "" [, string $encoding = mb_internal_encoding() ]] )
參數說明：
$str 爲要截斷的字符串（即原字符串，輸出的字符串）
$start 從第幾個字符開始截取，默認是0
$width 所需修剪的寬度
$trimmarker 截取後，在字符串末尾添加的內容（常見的爲...表示省略），默認我i空
$encoding 這個參數很重要，若是字符串是中文，必定要加上。不然。。。。就能夠看到「�」這東西了，之前沒仔細看過這個函數，在wordpress主題裏由於要顯示文章的一小段內容，而後末尾就有亂碼了，好久都不知道爲何。另外這個參數應該是跟網頁的編碼格式一致的，我的測試的時候網頁編碼utf-8，參數寫爲gbk的時候漢字就shit了。。（求大牛解釋）

php版本的就這樣了，有時候覺得是php語言的問題，其實只是咱們沒仔細研究它。

js版本的：
substring()和substr()方法，兩個方法*幾乎*沒區別，
substring()方法的第一個參數必填，爲要提取的子串的第一個字符在 字符串 中的位置，第二個參數可選，是要提取的子串的最後一個字符在 stringObject 中的位置多 1位，默認無，到字符串末尾。
substr()第一個參數必需。要抽取的子串的起始下標。必須是數值。若是是負數，那麼該參數聲明從字符串的尾部開始算起的位置。也就是說，-1 指字符串中最後一個字符，-2 指倒數第二個字符，以此類推。第二個參數爲可選。子串中的字符數。必須是數值。若是省略了該參數，那麼返回從 stringObject 的開始位置到結尾的字串。
例子：

<script type="text/javascript">
    var str="Hello world!"
    document.write(str.substring(3))
    </script>

這個例子輸出：lo world! 
從原字符串第三位開始，到末尾

<script type="text/javascript">
    var str="Hello world!"
    document.write(str.substring(3,7))
    </script>

這個例子輸出：lo w
從原字符串第四位開始，到第七位

<script type="text/javascript">
    var str="Hello world!"
    document.write(str.substr(3))
    </script>

輸出：lo world!
第三位開始到結尾

<script type="text/javascript">
    var str="Hello world!"
    document.write(str.substr(3,7))
    </script>

輸出：lo worl
從第四位開始，截取7位。

JS這兩個方法能夠看
http://www.w3school.com.cn/js/jsref_substring.asp
http://www.w3school.com.cn/jsref/jsref_substr.asp

第三個就是CSS的了
CSS截取主要使用text-overflow這個屬性。
text-overflow: [ clip | ellipsis | <string> ]

text-overflow默認值爲clip ，即當內容超出容器時，會裁切掉超出的文本，值爲ellipsis時，會用省略號替代超出的文本；也能夠用特定的字符串來替代超出的文本（目前僅 firefox 支持）。

省略號的例子：

.ellipsis{
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
    }

參考資料：
http://quirksmode.org/css/user-interface/textoverflow.html
https://developer.mozilla.org/en-US/docs/Web/CSS/text-overflow

其實css的說明看一下mozilla開發者網站的圖例就明白了。在這裏就很少說了。