입력 태그 내부에 링크

a href 및 img src을 입력 상자 (텍스트 상자)에 표시하는 방법. 예 : 나는 텍스트 상자 (<input id=link) 사전에입력 태그 내부에 링크

<a href="http://www.mysite.com/link" target="_blank"><img src="http://www.mysite.com/img.jpg" border="0" alt="mysite.com"></a>

덕분에 내부에이를 표시 할.

출처

2011-08-05 maxlk

이 왜 내부 링크를 넣어 싶어 입력 상자? – JJJ

안에 넣을 수는 없지만 절대적으로 또는 상대적으로 배치 할 수 있습니다. –

당신이하려는 것을 달성하기 위해 이것을 입력 태그 안에 넣지 않아도됩니다. – awesomesyntax

주석에 따라 기본 텍스트로 HTML 코드가있는 입력 필드를 원한다고 생각합니다. 따옴표에 대해서는 문자 참조 코드를 사용하고 부호보다 크거나 작은 문자는 사용해야합니다.

<input type="text" value="&lt;a href=&quot;http://www.mysite.com/link&quot; target=&quot;_blank&quot;&gt;&lt;img src=&quot;http://www.mysite.com/img.jpg&quot; border=&quot;0&quot; alt=&quot;mysite.com&quot;&gt;&lt;/a&gt;" />

(그건 그렇고, 당신은 "포토 버킷처럼"언급 - 당신은 단지 그들이 그것을 어떻게 볼 수있는 사이트의 HTML 볼 수 있습니다.)

출처

2011-08-05 16:46:31 JJJ

정확히 내가 원하는 것. 고맙습니다 – maxlk

의견에서 언급했듯이 input 텍스트 상자에는 문자 그대로 링크를 삽입 할 수 없습니다 (JavaScript로 시뮬레이션 할 수도 있음).

배경 이미지는 CSS background-image입니다.

출처

2011-08-05 16:32:08 Widor

두 가지 옵션이 있습니다.

이미지를 입력 배경으로 배치하지만 클릭 할 수 없습니다.
입력 위에 요소를 절대 배치하십시오.

1 :

.myInput { background:url(path/to/img.jpg) 5px 5px no-repeat; }

2 :

HTML

<div class="inputContainer"> 
    <input class="myInput" type="text" name="myInput" id="myInput" /> 
    <a href="#" class="inputImg"><img src="#" /></a> 
</div>

당신은 위치와 가치있는 플레이해야합니다

.inputContainer { position:relative; } 
.myInput { padding-left:25px; /* This will move the text from under the image */ } 
.inputImg { left:5px; position:absolute; top:5px; z-index:5; }

CSS es는 입력 크기, 이미지 크기 및 일반 배치에 따라 다르지만 원하는대로 할 수 있습니다.

출처

2011-08-05 16:46:22 Seth

입력 태그 내부에 링크

답변

관련 문제