• “三连冠”从何而来?恩施市领跑全省生态功能类县市揭秘 2019-09-16
  • 朝鲜军人敬了一个礼 特朗普看到后马上回了一个 2019-09-16
  • 北京市北京元之沃4S店【在线咨询】 2019-09-06
  • 指尖触碰 你我结缘丨浙江新闻4周年 我们再出发 2019-09-06
  • 聚焦十九大 专家解读:中国的大国外交彰显哪些理念? 2019-09-01
  • 【聚焦军博会】216个代表团2037个项目将亮相军博会 11大军工集团全部参展 2019-09-01
  • 聚焦机构改革:新部门接连挂牌 快速进入角色 2019-08-28
  • 二手房办证5个工作日搞定 2019-08-28
  • 218万游客在晋中市“粽”情过节 2019-08-22
  • 西安6月以来限购区域内无一家开盘,“摇号细则近日将出” ——凤凰网房产北京 2019-08-22
  • 晓港公园花卉馆南侧场地出租项目 2019-08-21
  • “三个90周年”系列秋收起义90周年纪念活动新闻发布会在昌召开 2019-08-11
  • 打造历史文化名城 “安宁记忆”项目启幕 2019-08-11
  • 罗品禧的专栏作者中国国家地理网 2019-08-10
  • 海淀创业园双创文化:双R沙龙,让创业之路越走越好 2019-08-10
  • 首页 > 编程学习记录 > 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-09-16
  • 朝鲜军人敬了一个礼 特朗普看到后马上回了一个 2019-09-16
  • 北京市北京元之沃4S店【在线咨询】 2019-09-06
  • 指尖触碰 你我结缘丨浙江新闻4周年 我们再出发 2019-09-06
  • 聚焦十九大 专家解读:中国的大国外交彰显哪些理念? 2019-09-01
  • 【聚焦军博会】216个代表团2037个项目将亮相军博会 11大军工集团全部参展 2019-09-01
  • 聚焦机构改革:新部门接连挂牌 快速进入角色 2019-08-28
  • 二手房办证5个工作日搞定 2019-08-28
  • 218万游客在晋中市“粽”情过节 2019-08-22
  • 西安6月以来限购区域内无一家开盘,“摇号细则近日将出” ——凤凰网房产北京 2019-08-22
  • 晓港公园花卉馆南侧场地出租项目 2019-08-21
  • “三个90周年”系列秋收起义90周年纪念活动新闻发布会在昌召开 2019-08-11
  • 打造历史文化名城 “安宁记忆”项目启幕 2019-08-11
  • 罗品禧的专栏作者中国国家地理网 2019-08-10
  • 海淀创业园双创文化:双R沙龙,让创业之路越走越好 2019-08-10
  • mg注册免费送彩金的网站 22选5定号最准的方法 牛牛在线视频国产免费 京东彩票中大奖 幸运农场开奖视频 重庆时时五星基本走势 体彩任选9错1场有奖吗 云南时时官方网 体20选5开了什么好 新时时彩任选一