位置顯示爲塊級元素

我想知道什麼是最好的方式來定位一個塊元素內的文本。位置顯示爲塊級元素

<a href="#">foo</a>

正常的鏈接，但與背景

display: block; 
width: 100px; 
height: 100px; 
background: #000000;

文本樣式作爲顯示塊現在是左上角。現在的問題是：以什麼最佳方式讓這個文本例如：左下或右下？

我更喜歡CSS解決方案，而在A-標籤內的任何新的元素。一些意見？

2011-12-05 ggzone

是沒可能給周圍設置鏈接另一包裝元素或者你只是不想？添加另一個元素會使這個簡單。 – SpaceBeers

不能選擇內容，以沿底部坐。通過使用填充（填充頂部），您可以手動使它看起來像ist的底部合理。所以在上面的例子中嘗試

display: block; 
width: 100px; 
height: 14px; 
background: #000000; 
padding-top: 86px

2011-12-05 13:54:31 JorgeLuisBorges

這是最好的解決方案嗎？我的意思是它們也垂直對齊表格，線條高度和類似的東西。 – ggzone

在塊元素沒有垂直對齊，對不起...... – ptriek

你真的不希望使用表格 - 無 - 心不是純CSS元素垂直對齊。 – JorgeLuisBorges

您也可以利用顯示：表細胞 - 但是，這不會在<工作= IE7

2011-12-05 13:59:32 ptriek

是的:)但我需要IE7，所以我會使用填充和文本對齊。但tx;） – ggzone

你可以試試這個太。

display: block; 
width: 100px; 
height: 100px; 
background: #000000; 
line-height:188px; 
font-size:12px; 
color:#fff; 
text-decoration:none;

如果您改變字體大小比低於值減少200像素:)意味着，如果你使用的是18像素的字體比的line-height會182px所以總沒有將200像素;

2011-12-05 14:38:54

這只是如果出於任何原因，框中的文本會變成兩行。 – JorgeLuisBorges

嗯..！比填充是解決方案。但它不會得到確切的價值，您需要試錯來設置您的身高。即使這也可能會給你多條線路帶來麻煩。如果多條線對您來說不是最好的解決方案，因爲我相信是** ptriek **給您的。當你不想添加任何標籤內錨比它很難爲多行，除非你使用設置** ** ptriek給出解決方案。 –

行高和填充的組合意味着沒有試驗和錯誤。 line-heght：20px paddong-top：180px = 200px爲一行文本，220px爲二等 – JorgeLuisBorges

回答