• 河北定州:秸秆回收变废为宝 2019-05-14
  • 妹妹半个多世纪前嫁到安徽 八旬老人想再见她一面 2019-05-14
  • 在这里,读懂2017——人民日报十大评论文章 2019-05-14
  • 步飘恒的专栏作者中国国家地理网 2019-05-14
  • 【奋斗者说】银河麒麟孔金珠:核心技术只有靠自己干出来 2019-05-13
  • 建好欧美同学会 助力伟大中国梦 2019-05-13
  • 看把你高兴的屁颠屁颠的,光有赞有什么用?我给你个货真价实的 [大红包]。 2019-05-13
  • 不动产登记全国联网 名下多少套房一查就知道 2019-05-13
  • 晋城:八项重点打好水污染防治攻坚战 2019-05-12
  • 天津:社区志愿者织密村镇平安网 2019-05-12
  • 中央纪委紧盯“节点” 4年来通报曝光问题近4000起 2019-05-12
  • 遭受外来杨梅挑战 宁波宠果地产杨梅还能走多远 2019-05-11
  • 发达国家全这样,尊重个人的选择。[微笑][微笑] 2019-05-11
  • 第528期:你知道吗?二月份吃什么水果最适合 2019-05-11
  • 忻州召开“雪亮工程”建设现场会 2019-05-10
  • ?
    欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
    您的位置:时时彩走势图后一 > HTML >

    HTML基础必学列表

    html <nobr>强制不换行标签元素

    时时彩走势图后一 www.cuhw.com.cn html <nobr>强制不换行标签-禁止内容换行html标签元素介绍篇

    在网页排版布局中比如文章列表标题排版,无论多少文字均不希望换行显示,需要强制在一行显示完内容。这就可以nobr标签来实现。

    一、nobr语法   -   TOP

    <nobr>内容</nobr>

    不换行内容放入<nobr>与</nobr>之间即可。

    此标签与css white-space功能相同。

    二、nobr标签特点:   -   TOP

    如不遇到br换行标签,内容在一行显示完,如遇到br换行标签,内容将在加br换行自动换行。

    三、html nobr禁止内容换行案例   -   TOP

    这里假如有4行文章标题列表,设置宽度为200px;css行高为22px;对4列的内容我们采用ul li列表布局,其中2个对内容加<nobr>标签,一个li内容不加,另外一个li内容少与宽度能显示完。

    1、完整html源代码

    1. <!DOCTYPE html> 
    2. <html xmlns="//www.w3.org/1999/xhtml"> 
    3. <head> 
    4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    5. <title>nobr标签实例 时时彩走势图后一 www.cuhw.com.cn</title> 
    6. <style> 
    7. ul{ border:1px solid #000; width:200px;} 
    8. li{ width:200px; line-height:22px} 
    9. </style> 
    10. </head> 
    11. <body> 
    12. <ul> 
    13. <li><nobr>第一排内容文字多加nobr标签测试内容</nobr></li> 
    14. <li><nobr>第二排内容文字多加nobr标签不能排下</nobr></li> 
    15. <li>第三排内容文字多没有加nobr标签</li> 
    16. <li>第四排 文字少能排下</li> 
    17. </ul> 
    18. </body> 
    19. </html> 

    2、效果截图

    nobr换行用法实例截图
    html nobr禁止换行用法实例截图

    3、案例测试查看案例
    这里可能大家发现一个问题,如果强制一行显示完内容,可能内容就会溢出设置宽度,可选择解决方法如下:

    1)、css省略号替代溢出内容
    2)、css隐藏超出DIV内容
    3)、css防止图片撑破div

    4、nobr案例打包下载

    相关时时彩走势图后一教程:
    使用nobr标签实现显示不完的文字变省略号

    如需转载,请注明文章出处和来源网址://www.cuhw.com.cn/html/h533.shtml

    我要分享到:

    必备CSS教程 Essential CSS Tutorials

    必备HTML基础教程 Essential HTML Tutorials

     

    如对文章有任何疑问请提交到DIV CSS论坛,或有任何网页制作CSS问题立即到CSS论坛发贴求解 或 直接DIVCSS5网页顶部搜索遇到DIVCSS疑问。
    时时彩走势图后一文章修订日期:2013-05-31 10:51 原创:时时彩走势图后一
    本文时时彩走势图后一 www.cuhw.com.cn DIVCSS5版权所有。

  • 河北定州:秸秆回收变废为宝 2019-05-14
  • 妹妹半个多世纪前嫁到安徽 八旬老人想再见她一面 2019-05-14
  • 在这里,读懂2017——人民日报十大评论文章 2019-05-14
  • 步飘恒的专栏作者中国国家地理网 2019-05-14
  • 【奋斗者说】银河麒麟孔金珠:核心技术只有靠自己干出来 2019-05-13
  • 建好欧美同学会 助力伟大中国梦 2019-05-13
  • 看把你高兴的屁颠屁颠的,光有赞有什么用?我给你个货真价实的 [大红包]。 2019-05-13
  • 不动产登记全国联网 名下多少套房一查就知道 2019-05-13
  • 晋城:八项重点打好水污染防治攻坚战 2019-05-12
  • 天津:社区志愿者织密村镇平安网 2019-05-12
  • 中央纪委紧盯“节点” 4年来通报曝光问题近4000起 2019-05-12
  • 遭受外来杨梅挑战 宁波宠果地产杨梅还能走多远 2019-05-11
  • 发达国家全这样,尊重个人的选择。[微笑][微笑] 2019-05-11
  • 第528期:你知道吗?二月份吃什么水果最适合 2019-05-11
  • 忻州召开“雪亮工程”建设现场会 2019-05-10