成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

使用CSS處理標(biāo)題過長，自動(dòng)截?cái)?，兼容響?yīng)式布局

weapon / 992人閱讀

摘要：應(yīng)用場景描述例如從數(shù)據(jù)庫讀取一個(gè)商品，那么當(dāng)商品標(biāo)題很長的時(shí)候，很可能會(huì)影響頁面布局。

應(yīng)用場景描述 
例如PHP 從數(shù)據(jù)庫讀取一個(gè)商品，那么當(dāng)商品標(biāo)題很長的時(shí)候，很可能會(huì)影響頁面布局。處理方法如下：



PHP 字符串截取


JS 字符串截取


CSS 屬性處理（推薦）
CSS 屬性處理方法

html代碼片段

  • 
    商品標(biāo)題商品標(biāo)題商品標(biāo)題商品標(biāo)題商品標(biāo)題商品標(biāo)題
    9秒前

    • css樣式代碼

    .cut{
    display: inline-block;        /*讓span 標(biāo)簽變成行內(nèi)標(biāo)簽但具有寬高屬性*/
    white-space: nowrap;         /*文本不進(jìn)行換行*/
    overflow: hidden;           /*隱藏溢出文本*/
    text-overflow: ellipsis;   /*多出文本使用 ....代替*/
    width: 7em;                /*自適應(yīng)布局*/
}
    CSS屬性處理后效果：

    文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

    轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/111325.html

    相關(guān)文章

    • 使用CSS處理標(biāo)題過長，自動(dòng)截?cái)?/em>，兼容響應(yīng)式布局

      摘要：應(yīng)用場景描述例如從數(shù)據(jù)庫讀取一個(gè)商品，那么當(dāng)商品標(biāo)題很長的時(shí)候，很可能會(huì)影響頁面布局。 應(yīng)用場景描述 例如PHP 從數(shù)據(jù)庫讀取一個(gè)商品，那么當(dāng)商品標(biāo)題很長的時(shí)候，很可能會(huì)影響頁面布局。處理方法如下： PHP 字符串截取 JS 字符串截取 CSS 屬性處理（推薦） CSS 屬性處理方法 html代碼片段 商品標(biāo)題商品標(biāo)題商品標(biāo)題商品標(biāo)題商品標(biāo)題商品標(biāo)題 9秒前 ...

      y1chuan 評(píng)論0 收藏0

    • 如何實(shí)現(xiàn)一個(gè)這樣的級(jí)聯(lián)組件

      摘要：封裝組件系列文章如何實(shí)現(xiàn)一個(gè)這樣的級(jí)聯(lián)組件組件背景根據(jù)產(chǎn)品原型實(shí)現(xiàn)一個(gè)級(jí)聯(lián)組件，下面看演示圖應(yīng)用場景很多，如后臺(tái)管理系統(tǒng)，旅游系統(tǒng)，廣告投放系統(tǒng)，營銷系統(tǒng)等，現(xiàn)在流行，，三大框架，下面看看怎么使用實(shí)現(xiàn)實(shí)現(xiàn)邏輯產(chǎn)品經(jīng)理的評(píng)審功能需求如下根據(jù)大 Vue封裝組件系列文章 如何實(shí)現(xiàn)一個(gè)這樣的級(jí)聯(lián)組件 組件背景 根據(jù)產(chǎn)品原型實(shí)現(xiàn)一個(gè)級(jí)聯(lián)組件，下面看演示圖 showImg(https://i.lo...

      daydream 評(píng)論0 收藏0

    • CSS處理文本過長或超出部分（解說一）

      摘要：在網(wǎng)頁開發(fā)中，經(jīng)常會(huì)遇到文本超出了限定的范圍，尤其是屏幕尺寸的大小導(dǎo)致的，著實(shí)影響美觀，這個(gè)時(shí)候，就需要用對(duì)其進(jìn)行處理。再補(bǔ)充一條，比如想讓內(nèi)容在第二行的時(shí)候，超出部分隱藏這個(gè)處理方式的目前只兼容內(nèi)核的瀏覽器其他方法見解說二 在網(wǎng)頁開發(fā)中，經(jīng)常會(huì)遇到文本超出了限定的范圍，尤其是屏幕尺寸的大小導(dǎo)致的，著實(shí)影響美觀，這個(gè)時(shí)候，就需要用css對(duì)其進(jìn)行處理。 下面的方法是我在實(shí)際工作中總結(jié)...

      Bamboy 評(píng)論0 收藏0

    • 【譯】如何，以及何時(shí)使用CSS多列布局

      摘要：示例鏈接核心代碼要知道，目前的規(guī)范，的取值只有或者。最近，片段模塊規(guī)范定義了如何為各種片段模塊上下文設(shè)計(jì)的碎片化的屬性，規(guī)范包括，和處于停滯狀態(tài)的區(qū)域樣式區(qū)域也會(huì)支持展示被分解碎片化連續(xù)的內(nèi)容。 原文：When And How To Use CSS Multi-Column Layout作者：Rachel Andrew譯者：博軒 當(dāng)我們把注意力都放在 CSS Grid 布局和 CSS ...

      fancyLuo 評(píng)論0 收藏0

    • 第六天 移動(dòng)端Web開發(fā)注意事項(xiàng)

      摘要：隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展，移動(dòng)已經(jīng)逐漸成為互聯(lián)網(wǎng)的主要入口，隨之而來的是前端在移動(dòng)開發(fā)上面臨的各種機(jī)遇與挑戰(zhàn)，本文就一些常見移動(dòng)端問題對(duì)移動(dòng)開發(fā)需要注意的事項(xiàng)進(jìn)行一下總結(jié)，必然不可能涉及方方面面，但會(huì)隨著筆者的積累持續(xù)更新。 隨著移動(dòng)互聯(lián)網(wǎng)的發(fā)展，移動(dòng)Web已經(jīng)逐漸成為互聯(lián)網(wǎng)的主要入口，隨之而來的是前端在移動(dòng)Web開發(fā)上面臨的各種機(jī)遇與挑戰(zhàn)，本文就一些常見移動(dòng)端問題對(duì)移動(dòng)Web開發(fā)需要注意...

      妤鋒シ 評(píng)論0 收藏0

    發(fā)表評(píng)論

    0條評(píng)論

    最新活動(dòng)
    閱讀需要支付1元查看
    <