如何使用鏈接的圖像時，擺脫連接的邊界？

該圖像描述了這一切：如何使用鏈接的圖像時，擺脫連接的邊界？

正如你可以看到，在每個圖像下邊界，而不是向左或向右。

此外，您可以看到，我在檢查器中標記了鏈接標記，它顯示了一個從圖像大致中間的框架，直到包含不需要的邊框的圖片下。

我已經從鏈接中刪除了文字修飾，但這並沒有改變一件事。

由於大部分沒有得到問題的根源，這裏的截圖的放大版本： http://imageshack.us/f/10/screenshotfgi.png/ 按照鏈接和你得到的圖片再次點擊。

看看右下方的藍色方塊。當我在檢查員中選擇了超鏈接標記時，Chrome會標記它。在這裏你可以看到，超鏈接會導致邊界/空間。如何通過改變超鏈接標籤的樣式來擺脫這個空間？

來源

2011-05-05 Joern Akkermann

你試過添加style =「border：0;」在img標籤上？ – easwee 2011-05-05 14:40:56

是...看幾秒鐘前的附加信息...你可以看到它是超鏈接，而不是圖像 – 2011-05-05 14:55:01

不要相信你所看到的 - 閱讀代碼。你不會相信會發生什麼事情。 – easwee 2011-05-05 15:03:15

我有類似的問題。

set line-height: 0對於錨或td's。

#your_id table a, #your_id table td { 
    line-height: 0; 
}

或手動設置的一個或TD height。

#your_id table a, #your_id table td { 
    height: 30px; 
} 
#your_id table a { 
    display: block; 
}

兩種方式都適合我。

來源

2011-05-05 14:47:54 seler

它是'「line-height：0px;」' – 2011-05-09 11:40:06

這不是一個邊界，這是一個空間。

默認情況下，圖像位於與a，b，c和d等字母相同的行上。該行下方有空格，用於顯示字母如g，j和y的下行字符。

設置CSS vertical-align屬性來移動該行的形象。

來源

2011-05-05 14:40:36 Quentin

然後我得到我在底部和頂部的較小邊框... – 2011-05-05 14:49:37

刪除圖像的邊界時，它是在沒有訴諸邊界=「0」鏈接：

a img { 
    text-decoration: none; 
    border: 0 none; 
    }

似乎並沒有被您的問題雖然。

編輯：檢查表的cellpadding/CELLSPACING。有一些填充或邊距應用於您的單元格。

來源

2011-05-05 14:41:27

他沒有在img標籤上的邊框。您可以看到圖像左側或右側沒有邊框。如果有的話也是藍色的。 – easwee 2011-05-05 14:46:33

easwee是正確的，此外，你可以看到圖片中，它來自超鏈接...在右下方的藍色框是超鏈接，這sorrounds區域包括底部的白色邊框 – 2011-05-05 14:48:45

由於您使用的是可能是由於將cellspacing屬性的表。

集：

<table cellspacing="0" cellpadding="0">

你的桌子上。 img在鏈接中時出現的邊框通常是藍色。

編輯：另一件可能會搞砸的東西可能是垂直對齊。我認爲默認設置爲基準 - 嘗試設置您的垂直對齊到vertical-align:top在td和img裏面

來源

2011-05-05 14:43:36 easwee

已經，甚至儘管邊框存在，如圖所示，它來自超鏈接 – 2011-05-05 14:47:48

@Joern Akkermann你能發佈一個鏈接到實際的代碼嗎？此外，您的表具有border-spacing：2px（您可以在右側的代碼檢查器中看到），因此存在與cellspacing等效的CSS。 – easwee 2011-05-05 14:48:36

很難說沒有一塊示例代碼...

我要說開始與重置對可能已經造成這一切的屬性：

table { 
    border-collapse: collapse; 
} 
table, tr, th, td { 
    border: 0; 
    padding: 0; 
} 
td, td a { 
    line-height: 0; 
    white-space: normal 
} 
td, a, td a img { 
    border: 0; 
    padding: 0; 
    margin: 0; 
}

這是否幫助？

來源

2011-05-05 14:59:40 Mushimo

+1。 – easwee 2011-05-05 15:03:34

如何使用鏈接的圖像時，擺脫連接的邊界？

回答

相關問題