배경 이미지에 하이퍼 링크를 만드는 방법은 무엇입니까?

Question

페이지의 파일 목록을 각 파일 이름의 끝에 표시합니다. 하나의 배경 이미지 (십자 표시)를 사용했습니다. 하지만 그 이미지는 클릭 가능한 요소 여야합니다. 내가 이미지를 클릭하면 그것은 내가 그 달성 몇 가지 제안을 줄 수있는 방법은 아래 이미지

를 참조 주어진 path.For 자세한 내용에서 삭제해야합니다. HTML과 CSS 코드 아래 내가 그 이미지를

$data .= '<div class = "public-file-names" ><a href="'.$path .'xmluploads/'. $foldnames .'/'. $filenames.'" target="_blank" download>' ."--". $filenames .'</a><br></div>'; 

div.public-file-names { 


    background: transparent url("../images/close-cross.jpg") no-repeat scroll right center; 
    font-size: 14px; 
    margin: 10px 0; 
    } 

Answer 1

사용에 도움이하려는 경우 알려 경우 왼쪽 버튼을 누른 다음 배경 이미지를 태그로 이동하십시오.

$data .= '<div class = "public-file-names" ><a href="'.$path .'xmluploads/'. $foldnames .'/'. $filenames.'" target="_blank" download>' ."--". $filenames .'</a><br><a href="" class="delete-button"></a></div>'; 

.public-file-names { 
    font-size: 14px; 
    margin: 10px 0; 
} 

.delete-button { 
    float: right; 
    display: inline-block; 
    width: 16px; 
    height: 16px; 
    background: transparent url("../images/close-cross.jpg") no-repeat scroll right center; 
} 

Answer 2

당신이 jQuery를 사용할 수

을 표시하기 위해 사용하고 있지만 HTML에 의해 달성 될 수있다 당신이 당신 .public-파일 이름의 각각을 포장 할 수

가에서 div를 는 A 태그

<a href="your-link.html"> 
    <div class="public-file-names"> 

    </div> 
</a> 

<a href="your-link.html"> 
    <div class="public-file-names"> 

    </div> 
</a> 

<a href="your-link.html"> 
    <div class="public-file-names"> 

    </div> 
</a> 

당신을 위해 그 나던 작품은 내가 당신이 날 당신은 드에 대한 또 다른 앵커 태그를 추가 할 필요가 당신이 jQuery를