濟(jì)南網(wǎng)站建設(shè) 文匯傳媒小編 就前端面試工程師面試時(shí)經(jīng)常會(huì)遇到的一個(gè)面試題來(lái)給大家做個(gè)詳細(xì)的解析。
這次要說(shuō)的呢是比較基礎(chǔ)常見(jiàn)的一個(gè)題目 ：如何實(shí)現(xiàn)一行文字居中 多行文字居左的效果？
這個(gè)問(wèn)題剛一聽(tīng)覺(jué)得挺簡(jiǎn)單的，實(shí)際操作的時(shí)候又會(huì)有些不知所措 ，會(huì)有是不是有什么標(biāo)簽自己沒(méi)有接觸到的一個(gè)想法；其實(shí)不然 下面我們來(lái)具體解析一下。
首先：文本內(nèi)容的居中實(shí)現(xiàn)大家都不陌生 text-align:center; 就可以輕松實(shí)現(xiàn)文本水平居中的效果 ；那么多行的時(shí)候居左顯示怎么辦呢？這個(gè)時(shí)候就需要嵌套一個(gè)P標(biāo)簽來(lái)實(shí)現(xiàn)了。
下面看下源碼：
下面是效果圖：
一行文字居中：
多行文字居左：
英文單詞過(guò)長(zhǎng)使文字溢出容器:
word-break:break-all; 強(qiáng)制換行效果：
好了，以上就是濟(jì)南網(wǎng)站建設(shè)的小編本次為大家分享的內(nèi)容，有哪些不對(duì)的地方歡迎大家留言評(píng)論補(bǔ)充說(shuō)明，謝謝！
