1
我有圖像鏈接到我的網站上的文字。文本顯示爲鏈接,當在圖像上方懸停時出現在屏幕上的固定位置並在其下方顯示文字來描述它。我希望圖像下方的文字看起來很平坦,沒有下劃線。它在IE9,Chrome和Firefox中執行,但不在Safari中執行。文本鏈接的HTML看起來像這樣: -如何停止Safari鏈接圖像中的下劃線文字?
<p><a class="thumbnail" href="#thumb">Basil Thomas Stirratt<span><img src="images/basil stirrat.jpg" width="200" height="299" alt="" /><br />Basil Thomas Stirratt<br />taken June 1940</span></a>, who was 18 at the time, had been......</p>
的CSS是這樣的: -
.thumbnail{
background-color:#FFFF00;
position:static;
z-index: 0}
.thumbnail:hover{
background-color:#CCCCCC;
z-index: 50}
.thumbnail span{ /*CSS for enlarged image*/
position:fixed;
background-color:#99CCFF;
padding:5px;
left: -1000px;
border: 10px ridge #E0E0E0;
visibility: hidden;
text-decoration:none;
text-indent:0px;
font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
color:#000000;
text-align:center;
-moz-box-shadow: 3px 3px 8px #333333;
-webkit-box-shadow: 3px 3px 8px #333333;
box-shadow: 3px 3px 8px #333333;}
.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;}
奇怪的是我似乎沒有被允許張貼的圖像來演示該問題。要查看這些圖像如何顯示,請查看我的網站[1]:http://www.wellingtont2905.co.uk/story.html,查找黃色突出顯示的文本並將光標懸停在上面。
有關我如何阻止Safari執行此操作的任何建議?
我曾'文字'結構,並不明白什麼是跨度的問題。問題很簡單。我在anchor標籤上應用了'text-decoration:none'。 – ivkremer 2013-08-30 10:22:03