配售圖像是在WebContent文件夾中的H2標籤在HTML

我創建選項卡式部分與標籤標題爲H2如下：配售圖像是在WebContent文件夾中的H2標籤在HTML

<div class="mainTab"> 
    <div class="myTab"> 
     <h2>Tab1</h2> 
      Tab1 content here 
    </div> 
    <div class="mtTab"> 
     <h2>Tab2</h2> 
      Tab2 content here 
    </div> 
<div>

我想要的標籤標題，前放置一個圖像。像電子郵件標籤標題之前的電子郵件圖

這可以通過類似方式實現：

.h2one { 
    font-size: 36px; 
    font-weight: bold; 
    background: url ('http://images.findicons.com/files/icons/1676/primo/128/email_open.png') center left no-repeat; 
padding-left: 120px; 
} 

.h2two { 
font-size: 36px; 
font-weight: bold; 
background: url('http://images.findicons.com/files/icons/1676/primo/128/email_close.png') center left no-repeat; 
padding-left: 120px; 
}

如果什麼圖像都在我的服務器的WebContent文件夾。在這種情況下，url將如何顯示。將< =％request.getContextPath>在這裏工作????

來源

2011-09-23 Nik

這裏有一個小的jsfiddle做什麼，我想你正在嘗試做的：http://jsfiddle.net/NqXhB/1/ –

@nikunj;您可以使用background-image在h2標籤這樣

h2{ 
backgrond:url(image.jpg) no-repeat 0 3px; 
padding-left:10px; 
}

在上面的例子中

我定義圖像background positionleft:0 & top:3px但你可以根據你的要求調整圖像&我也給padding-left所以，文本移10px的，你可以看到圖片。

您還可以使用text-indent而不是padding。

，如果你想爲不同的分頁單獨的圖像，然後給出不同類的background images這樣的： http://jsfiddle.net/sandeep/NqXhB/4/

來源

2011-09-23 05:45:35 sandeep

如果我需要單獨的圖像爲不同的標籤。如何用你的答案達到目標？ – Nik

使用類。需要藍色圖像（例如）的h2將具有藍色等級： h2.blue {background：url（「image.png」）no-repeat 0 3px;填充左：10px的;} – Snicksie

你需要使用CSS的背景圖像屬性..這裏是讓你開始了一個鏈接：http://w3.org/TR/CSS2/colors.html#background

，具體到你的問題：

<h2 class="image">My photo album</h2>

和樣式表如下：：

.image{ width: 300px; height: 75px; background-image: url(header.gif); background-repeat: no-repeat; }

通過W3標準：

Partial URLs are interpreted relative to the source of the style sheet, not relative to the document

因此如果你的CSS是在內容文件夾，你需要去的圖像文件夾..你去是這樣的：網址（「../圖像/ header.png」）

來源

2011-09-23 05:43:12 Baz1nga

... w3schools :) – Sufendy

我知道..良好的第一個鏈接谷歌..：P和它不像他們已經得到了一切錯誤.. – Baz1nga

如果我想爲每個選項卡不同的圖像怎麼辦？所以我將不得不爲每個頭定義幾個圖像類。我對嗎？ – Nik

你把圖像這樣

<h2><img src='image/email.jpg' />Email</h2>

來源

2011-09-23 05:44:27 Sufendy

配售圖像是在WebContent文件夾中的H2標籤在HTML

回答

相關問題