이미지 뒤에 텍스트를 숨기는 방법

내 웹 템플릿 (Photoshop에서 만든)을 준비하고 서버에 업로드하도록 설정했습니다. 그러나 사용자가 이미지를 숨기거나 비활성화하면 모든 텍스트가 이미지에 있기 때문에 웹 사이트가 비어있게됩니다.이미지 뒤에 텍스트를 숨기는 방법

나는 CSS 레이아웃을 만들었고 웹 사이트의 텍스트 버전을 만들고 싶지만 텍스트를 이미지 위에 겹치지 않고 어떻게 이것을 할 수 있습니까 ?? 사용자가 브라우저에서 이미지를 사용하지 못하게하는 경우 웹 사이트의 텍스트 버전을 계속 볼 수 있기를 바랍니다.

HTML 코드 :

<div id="main_divs_container"> 
    <div id="left_div"><img src="images/left_div.jpg" width="249" height="622" alt=""></div> 
    <div id="index_middle_div"><img src="images/index_middle_div.jpg" width="488" height="622" alt=""></div> 
    <div id="right_div"><img src="images/right_div.jpg" width="253" height="622" alt=""></div> 
</div>

출처

2012-12-14 user482520

놓습니다 alt= 태그의 텍스트입니다.

이미지 차단시 텍스트가 표시되어야합니다.
(alt 태그의 목적은 이미지에 액세스 할 수없는 경우 내용을 표현하는 것과 비슷합니다.)

렌더링하는 경우 텍스트로드가 포함되어 있으면 꽤 좋아지지 않습니다. 조금도.
최상의 옵션은 텍스트없이 이미지를 배경으로 사용하고 HTML을 통해 이미지 위에 텍스트를 추가하는 것입니다.

출처

2012-12-14 08:41:41 Cerbrus

을 :)되지 않은 경우 감지 JS를 사용하여 어울리는 스타일을 적용 그래서 당신이 말을하는지 나는 내가 떠날 것이라고 같은 방식으로 포토샵의 이미지를 수정해야 할 것입니다 텍스트 부분을 공백으로 두어 HTML을 통해 텍스트를 추가 할 수 있습니까? – user482520

@ user482520 : 그게 최선의 선택이 될 것입니다. 즉, 이미지가로드되지 않으면 텍스트가 계속 표시되며 텍스트가 'alt' 태그에있을 때보 다 텍스트를 제어 할 수 있습니다. (CSS와 그 모든 것) – Cerbrus

True! 고맙습니다! – user482520

하나의 html 웹 사이트 버전을 만들어야합니다. 포토샵에서는 참조 용 또는 고객 리뷰 용 템플릿을 만듭니다 (시각적 인 용도로만 사용). 그것은 최종 결과가 아닙니다.

출처

2012-12-14 08:47:05

CSS 이미지 교체 (http://css-tricks.com/css-image-replacement/)를 사용하면 HTML의 텍스트 (이미지가 표시되지 않음)에 텍스트와 이미지를 포함 할 수 있습니다.

보다 큼 CSS 스타일을 작성해야합니다. CSS 스타일을 작성해야합니다. 하나는 이미지를 표시하고 텍스트는 숨기고 다른 하나는 oposit을 수행합니다.

다음 단지 사용자가 이미지를 차단 또는

출처

2013-01-27 11:43:27 sloik

이미지 뒤에 텍스트를 숨기는 방법

답변

관련 문제