将图像添加到按钮

我想向按钮.img-btn-next和img-btn-prev添加.png图像。 这是一个图片库,我想将按钮替换为下一个图标。 我是一个初学者,我想这并不困难。 感谢您的帮助。

    display: block;
    padding: 0.5vw 0.5vw;
    position: fixed;
    background-color: black;
    color: white;
    top: 50vh;
    z-index: 150;
    font-family: Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    cursor: pointer; 

}

.img-btn-next:hover{
    opacity: 0.8;
}

.img-btn-prev {
    display: block;
    padding: 0.5vw 0.5vw;
    background-color: black;
    position: fixed;
    top: 50vh;
    z-index: 150;
    font-family: Arial, Helvetica, sans-serif;
    color: white;
    cursor: pointer;
    text-transform: uppercase;
}

.img-btn-prev:hover{
    opacity: 0.8;
-----------------------------------------------------------------------

let newNextBtn = document.createElement("a");
                let btnNextText = document.createTextNode("next");
                newNextBtn.appendChild(btnNextText);
                container.appendChild(newNextBtn);
                newNextBtn.setAttribute("class", "img-btn-next");
                newNextBtn.setAttribute("onclick", "changeImg(1)");
                newNextBtn.style.cssText = "right:" + calcImgtoEdge + "px;";



                //last Button
                let newPrevBtn = document.createElement("a");
                let btnPrevText = document.createTextNode("last");
                newPrevBtn.appendChild(btnPrevText);
                container.appendChild(newPrevBtn);
                newPrevBtn.setAttribute("class", "img-btn-prev");
                newPrevBtn.setAttribute("onclick", "changeImg(0)");
                newPrevBtn.style.cssText = "left:" + calcImgtoEdge + "px;";

}

评论