不知平時(shí)工作中，大家有沒(méi)有遇到跟筆者相似的情況：設(shè)計(jì)圖紙上某句話必須是一行顯示的绰疤，實(shí)際實(shí)現(xiàn)卻偏偏因一個(gè)字而換行铜犬。比如：某設(shè)計(jì)圖紙是這樣的：
capture1.png
咋一看似乎沒(méi)什么難度嘛，很普通的布局而已轻庆，很容易讓人想到給盒子上下左右padding基本就完事兒了癣猾。不知大家注意到圖中的小藍(lán)線沒(méi)有，也就是說(shuō)余爆，如果給盒子右的padding一個(gè)固定值纷宇，那么必然會(huì)導(dǎo)致第五行文字（最后一行）的“有”（最后一字）會(huì)換行。
即真實(shí)實(shí)現(xiàn)的樣子：
capture2.png
真是理想與現(xiàn)實(shí)的差距呀蛾方。那么怎樣還原設(shè)計(jì)圖呢像捶？一開(kāi)始筆者想到的是很硬核的實(shí)現(xiàn)：absolute。但桩砰。拓春。。真的很硬核亚隅，真想直接告訴設(shè)計(jì)師實(shí)現(xiàn)不了硼莽。然而問(wèn)題的解決方案往往比想象中的容易，那就是使用我們今天的主角：white-space
/*僅作用于第五行文字*/
white-space: nowrap;
竟然一句話就搞定了呢煮纵，所以有時(shí)遇到問(wèn)題還真應(yīng)該冷靜去思考分析呢懂鸵，今此做下記錄，幫助遇到類(lèi)似問(wèn)題的小伙伴行疏。
