Блог

Как добавить боковое изображение к кнопке с помощью css. Я немного подчистил наш сайт и преобразовал пару страниц из табличного формата в css с помощью divs. Теперь у кнопок нет закругленных сторон, как раньше, но у нас все еще есть боковые изображения. может кто-нибудь показать мне, как просто добавить эти изображения обратно через divs или css после и до или что-то в этом роде. вот как выглядит div и css для кнопки.

 <div>
    <!-- Edit Repair Button -->
    <cc1:TemplateButton ID="btnRepair" CssClass="costBenefitButton" runat="server" OnClientClickObjectPaths="0, RecordID; 1, CurrentUser"
        OnClientClickFormatString="ProblemRepair_problemID = '{0}'; User='{1}'; ModalDivEngine_ShowDiv('ProblemRepairDiv');"
        TextFormatString="<%$ Resources:CostBenefitDetails, CostBenefitDetails_btnRepair %>" />
    <%=TemplateManager.LOOP_TAG_END %>
</div>
  

CSS:

 .costBenefitButton
{
    background-image: url(../../Images/SubmitButtonBack.png);
    color: White;
    font-family: Verdana;
    font-weight: bold;
    font-size: 8pt;
    width: 160px;
    height: 22px;
    border: none;
    position: relative;
    cursor: pointer;
    margin-bottom: 5px;
}
  

Пожалуйста, никаких плагинов jquery или prototype. Спасибо

  background: #color url(../../Images/SubmitButtonBack.png) no-repeat left top;
  

Это поместит ваше изображение в верхний левый угол кнопки. Теперь вам может потребоваться немного переместить значок, чтобы он был размещен идеально, поэтому вместо left top вам может потребоваться использовать значения пикселей (например, 2px 3px ), которые затем располагаются напротив верхнего левого пикселя кнопки.