什么是自适应宽度

时间:2012-03-31 关注公众号 来源:电脑软硬件应用网

  大概需求和情况是这样的.今天提交的代码自我感觉是比较好的一版了,代码质量和个人编程知识/经验等紧密相关,不求最好,但求better and better.在这里做一个总结文。

  当内容超出父级元素宽度,在未设置white-space:nowrap时会自动换行,设置了white-space:nowrap样式又不能关联到滚动条延伸的部分,解决方案如下:

  1、在父级元素添加white-space:nowrap属性;

  2、计算(每一行)内容宽度;

  a、将内容拆分,包括缩进、图片和文字。

  b、利用《又谈换行情况处理》中在body末尾添加非换行dom元素计算文字宽度。

  c、叠加拆分的小块宽度为总宽度。

  3、去掉父级元素的white-space:nowrap属性;

  4、取2中最大宽度,设置成父级元素的宽度(最好在该精确宽度的基础上增加6px-8px的宽度预留给滚动条,一是满足滚动条出现,二是也不会贴边)。

  该方法优点(与之前几种方案相比):

  1、宽度计算准确。

  2、性能稳定,没有之前循环“试探”的过程,遍历一遍节点即可完成。

  What's more, 工作总是在种种业务场景之下的,像上面解决的这个问题就是。

阅读全文
扫码关注“ 多特资源库
更多更全的软件资源下载
文章内容来源于网络,不代表本站立场,若侵犯到您的权益,可联系我们删除。(本站为非盈利性质网站)
玩家热搜

相关攻略

正在加载中
版权
版权说明

文章内容来源于网络,不代表本站立场,若侵犯到您的权益,可联系我们删除。(本站为非盈利性质网站)

电话:13918309914

QQ:1967830372

邮箱:rjfawu@163.com

toast