云南的天空有一种静谧之美,在这片土地上就连时间都流淌得格外缓慢。东方刚露出第一抹红霞,小河像一位刚梳洗完毕的姑娘,对着镜子整理晨妆,面颊上飞出几片羞答答的红晕。
大概需求和情况是这样的.今天提交的代码自我感觉是比较好的一版了,代码质量和个人编程知识/经验等紧密相关,不求最好,但求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, 工作总是在种种业务场景之下的,像上面解决的这个问题就是。
本文谈自适应宽度到此结束。单纯是我追求的一种生活方式,也是我持续的一种创作心态,但追求单纯需付出许多代价,你必须要有勇气承担因为单纯而带来的被他人利用欺瞒及孤立。但我觉得人生本来就该尽可能坚持一种单纯的状态,因这种状态是最接近自我的内心,一个纯静的内心会把许多事情导入正向,让你拥有一个物质之外的丰富人生。小编再次感谢大家对我们的支持!