• 人民日报客户端宣传页 2019-11-15
  • 一语惊坛(6月5日):担当新使命,展现新作为。 2019-11-15
  • 俄罗斯驻华大使:未来上合的首要任务是加强区域一体化 2019-11-14
  • 今后不懂藏文也能读《格萨尔》了 2019-11-14
  • 太原网友:谁来管管逢雨必淹的山大附小周边 2019-11-13
  • 拉萨市为第五批市级非遗代表性项目传承人颁证 2019-11-12
  • 商务部新闻发言人对美白宫6月18日声明发表谈话 2019-11-12
  • “袋鼠军团”宣称有秘密武器 老将新秀谁更耀眼? 2019-11-11
  • 他们是中国军人,他们2个月排除380万平方米雷场 2019-11-07
  • 陕西守艺人丨传承自父亲的老油坊,是我人生的希望之光 2019-11-04
  • 人民日报评论:在端午品味文化的芳香 2019-11-04
  • 广东摧毁两“呼死你”团伙 恶意呼叫超过12亿次 2019-11-03
  • 400年来旷日持久的一桩公案:《西游记》作者真的是吴承恩吗? 2019-11-03
  • 紫光阁中共中央国家机关工作委员会 2019-11-03
  • “普京4.0”时代 三大执政优势应对挑战 2019-11-02
  • 首页 > 编程学习记录 > white-space:nowrap实现让文字不换行

    201511月15

    white-space:nowrap实现让文字不换行

    作者:admin 0 Comments 发表评论

    曾道人新报跑狗 www.jmuag.tw 今天写超级购的CSS属性,遇到个问题,就是在手机上显示的时候,和电脑上显示的不太相同,电脑上,说明文字和下方的表格都是全屏展示,但在手机上展示的时候,说明文字自动换行了:

    手机上的展示图样

    而我想文字也只显示一点,跟表格一样是往右拖再看后面的内容的!

    后面通过群里网友的指点,说是只要在样式里添加上:

    white-space:nowrap

    属性就可以了。测试以后,果然实现了效果,上面的说明文字不会再自动换行了。

    百度了下这个属性的说明,很多说法,不过有一条应该是比较准确的:

    当你不想让块内的文字换行时,就可以用这个属性。

    比如下面的例子:

    <!–当外层容器设置了宽度而你又不希望内层内容换行时–>
    <div style = ‘width:100px;’>
    <p style = ‘white-space:nowrap;’>
    神马都是浮云神马都是浮云神马都是浮云神马都是浮云神马都是浮云神马都是浮云神马都是浮云
    </p>
    </div>

    因为设置了DIV块的宽度为100像素,所以如果上面的代码中,没有“white-space:nowrap”这个样式限制,那么里面的文字会因为宽度不够而自动换行,但如果添加了这个样式限制,那么就不会管DIV宽度的限制了,一直在一行显示下去,如果不想让超出DIV范围的内容显示,还要添加一个溢出样式限制,比如:“overflow: hidden”。

    通过两个图来说明,第一幅是没有添加“white-space:nowrap”限制的,第二幅是添加了“white-space:nowrap”样式限制的:

    1图2图

    推荐阅读相关文章:编程学习记录

    本文地址://www.jmuag.tw/white-spacenowrap.html
    版权所有 © 转载时必须以链接形式注明作者和原始出处!

    本文目前尚无任何评论.

    发表评论

  • 人民日报客户端宣传页 2019-11-15
  • 一语惊坛(6月5日):担当新使命,展现新作为。 2019-11-15
  • 俄罗斯驻华大使:未来上合的首要任务是加强区域一体化 2019-11-14
  • 今后不懂藏文也能读《格萨尔》了 2019-11-14
  • 太原网友:谁来管管逢雨必淹的山大附小周边 2019-11-13
  • 拉萨市为第五批市级非遗代表性项目传承人颁证 2019-11-12
  • 商务部新闻发言人对美白宫6月18日声明发表谈话 2019-11-12
  • “袋鼠军团”宣称有秘密武器 老将新秀谁更耀眼? 2019-11-11
  • 他们是中国军人,他们2个月排除380万平方米雷场 2019-11-07
  • 陕西守艺人丨传承自父亲的老油坊,是我人生的希望之光 2019-11-04
  • 人民日报评论:在端午品味文化的芳香 2019-11-04
  • 广东摧毁两“呼死你”团伙 恶意呼叫超过12亿次 2019-11-03
  • 400年来旷日持久的一桩公案:《西游记》作者真的是吴承恩吗? 2019-11-03
  • 紫光阁中共中央国家机关工作委员会 2019-11-03
  • “普京4.0”时代 三大执政优势应对挑战 2019-11-02
  • 云南11选5购买软件 69棋牌下载安装 双色球087期红球杀号 七乐彩走势图大全表 1青海11选5开奖结果查询 大嘴刨幺 梅州大乐透大奖 体彩快中彩玩法 澳洲幸运10开奖链接 在中国福彩网站上能购买彩票吗