CSS中可以使用多種方法來實(shí)現(xiàn)兩行顯示,以下是一種簡單的方法:
1、在HTML中,將要顯示兩行文本的容器元素(如div)的樣式設(shè)置為“display: flex;”,這將使容器元素成為彈性布局容器,可以容納多行文本。
2、在容器元素內(nèi)部,使用兩個(gè)子元素來分別顯示兩行文本,每個(gè)子元素的樣式可以設(shè)置為“flex: 1;”,表示它們將平均分配容器元素的寬度。
3、給每個(gè)子元素添加文本內(nèi)容,即可實(shí)現(xiàn)兩行顯示的效果。
以下是一個(gè)示例代碼:
HTML:
<div style="display: flex;"> <div style="flex: 1;">***行文本</div> <div style="flex: 1;">第二行文本</div> </div>
CSS:
div { display: flex; } div > div { flex: 1; }
在這個(gè)示例中,我們創(chuàng)建了一個(gè)包含兩個(gè)子元素的彈性布局容器,每個(gè)子元素都設(shè)置了“flex: 1;”,使得它們能夠平均分配寬度,我們給每個(gè)子元素添加了文本內(nèi)容,從而實(shí)現(xiàn)了兩行顯示的效果。