怎么让文字在图片的下方居中显示?
圖片與文字的位置
側(cè)耳傾聽(tīng)1614427
2017-09-28 12:29:46
3 回答
堇延未七
TA貢獻(xiàn)36條經(jīng)驗(yàn) 獲得超19個(gè)贊
文字居中顯示問(wèn)題：
如果被設(shè)置元素為文本、圖片等行內(nèi)元素時(shí)，水平居中是通過(guò)給父元素設(shè)置text-align:center來(lái)實(shí)現(xiàn)的。
文字在圖片的下方：
將圖片用div包裹，文字用另一個(gè)div包裹，然后圖片所在div放在文字所在div上面。
慕spring
TA貢獻(xiàn)38條經(jīng)驗(yàn) 獲得超4個(gè)贊
<img?src=""?>
<div?style="text-align:center">你想輸入的文字</div>
慕斯卡8036547
TA貢獻(xiàn)10條經(jīng)驗(yàn) 獲得超5個(gè)贊
<!DOCTYPE html>
<html>
<head>
? ? <meta charset="UTF-8">
? ? <title>Document</title>
? ? <style type="text/css">
? ? *{
? ? ? ? margin: 0;
? ? ? ? padding: 0;
? ? }
? ? .one{ height:100px;?
? ? ? ? width:200px;?
? ? ? ? background:skyblue;?
? ? ? ? line-height:170px;
? ? ? ? text-align: center;?
? ? ? ? overflow:hidden;
? ? }
? ? </style>
</head>
<body>
? ? <div class="one">
? ? ?居中顯示
</div>
</body>
</html>
你要的是這種效果嗎？
添加回答
舉報(bào)
0/150
提交
取消