轉自：將文本定位於div的底部的方法 摘要: 下文講述將文本放於div的底部的兩種方法，如下所示: 實現思路: 思路1:採用絕對定位的方式，將其放置於div的底部 思路2:使用Line-height屬性將文本放置於div的底部 行高大小設置的計算公式:(height-(font-size/2))x2 ...
摘要:
下文講述將文本放於div的底部的兩種方法，如下所示:
實現思路:
思路1:採用絕對定位的方式，將其放置於div的底部
思路2:使用Line-height屬性將文本放置於div的底部
行高大小設置的計算公式:(height-(font-size/2))x2=***px
(100-(12/2)*2 = 188px;
在web開發中,我們經常需要將div中的文本進行相關的定位，那麼下文將通過舉例的方法講述
底部對齊的方法分享
<html> <head> <meta charset="utf-8"> <title>貓貓教程(www.maomao365.com)</title> <style> .div1{ height:180px; width:180px; border:1px solid blue; position:relative } .div1 p{ position:absolute; bottom:0px; padding:0px; margin:0px } .div2{ height:100px; width:180px; border:1px solid blue; font-size:12px; line-height:188px; } </style> </head> <body> <div class="div1"> <p>這裡是maomao教程</p> </div> <br /> <div class="div2"> 貓貓教程歡迎你 </div> </body> </html>
