我手風琴如下。在手風琴兩側展示圖像
<div class="question">Header 1</div>
<div class="answer">
text 1
</div>
<div class="question">Header 2</div>
<div class="answer">
text 2
</div>
CSS我是
#wrapper {
width: 100%;
font-family:verdana;
font-size:12px;
}
.question {
width: 100%;
float: left;
border: solid blue;
border-width: thin;
background-color: #5CB3FF;
font-size: 18px;
font-weight: bold;
padding-top:20px;
cursor: pointer;
background-image: url(images/down_arrow.jpg);
background-size: 5% 100%;
background-repeat : no-repeat;
}
.question:hover {
border: solid blue;
border-width: thin;
background-color: #736AFF;
}
.answer {
width: 100%;
float: left;
padding-top:10px;
padding-bottom:10px;
}
.active {
background-image: url(images/up_arrow.jpg);
background-size: 5% 100%;
background-repeat:no-repeat;
}
這給我的輸出如下
| image Header 1 |
| image Header 2 |
我要的是在右側添加相同的圖像也使輸出將
| image Header 1 image |
| image Header 2 image |
你可以添加jquery/javascript代碼嗎? – Giona
@GionaF:你爲什麼需要jquery/javascript代碼?這是CSS工作... –