在CSS中,有時需要將兩行文字垂直排列,以便使頁面更美觀和易讀。下面介紹兩種實現方法:
方法一: .vertical{ display:flex; flex-direction:column; justify-content:center; }
以上代碼使用了Flex布局,設置Flex主軸為垂直方向,然后將子項垂直居中。使用該樣式類可以將任何元素的兩行文字垂直排列。
方法二: .vertical{ position: relative; } .vertical p{ position: absolute; top: 50%; transform: translateY(-50%); }
以上代碼使用了絕對定位和transform屬性。將父元素設置為relative定位,再將子元素絕對定位,并且向上移動50%。此時文字的中心與父元素的中心重合。然后使用transform: translateY(-50%)向上移動子元素的一半高度,以使文字垂直居中。
上一篇mysql查不了字符集
下一篇css兩行文字放在一行