HTML의 이미지 <img> 태그-HTML 튜토리얼-php.cn

HTML의 이미지 태그

墨辰丷

풀어 주다： 2018-06-04 15:05:05

원래의

2701명이 탐색했습니다.

본 글은 주로 HTML 이미지 img 태그 관련 정보를 소개하고 있습니다. 필요하신 친구들은 참고하시면 됩니다. >

support

H2+ / e2+ / N2+ / Fx1+ / Op6+ / Ch1+ / Sa1+

태그 생략

시작 태그: 필수, 종료 태그: 없음

Explanation

img는 Image의 약어입니다. src 속성은 이미지 경로를 지정하는 데 사용됩니다.

HTML4.01에서는 이미지를 표시할 수 없는 다양한 브라우저와 오디오 읽기 브라우저와 협력하려면 태그에 alt 속성을 설정해야 합니다. HTML5는 선택사항이 됩니다.

height 속성과 width 속성은 꼭 필요한 것은 아니지만, 이 두 속성을 설정하면 이미지를 더 빠르게 열 수 있고, 이미지를 표시할 때 특정 표시 버그를 피할 수 있습니다.

속성

【중요 속성】

속성	의미
src=url	H2+/e2+/N2+. 이미지의 경로입니다. 필수 속성입니다.
alt=alt	H2+/e2+/N2+. 그림에 대한 설명입니다. 일부 브라우저에서 이미지를 표시할 수 없는 경우 웹페이지에서 이미지 설명을 볼 수 있습니다. HTML4.01의 필수 속성입니다.
height=n	H3+/e2+/N2+. 이미지 높이를 설정합니다.
너비=n	H3+/e2+/N2+. 이미지 너비를 설정합니다.

【특징】

속성	의미
align =align	H2- H4T/e2+/N2+. 이미지의 표시 위치를 지정합니다. 이미지의 왼쪽이나 오른쪽에 텍스트를 표시하려면 align="right" 및 align="left"를 설정하세요. 이 효과를 취소하려면 을 사용하세요.
border=n	H3-H4T/e2+/N2+. 이미지 주변의 테두리 선 두께를 지정합니다. ~ 태그에 이미지가 포함되면 테두리가 자동으로 생성됩니다. 취소하려면 border=0으로 설정하세요.
galleryimg=bool	e6+. 200×200보다 큰 이미지 위에 마우스를 놓으면 툴바가 표시되지 않습니다. 에서 전역적으로 지정할 수도 있습니다.
hspace=n	H3-H4T/e2+/N2+. 이미지 주위의 수평 여백을 설정합니다.
longdesc=url	H4. 이미지 설명이 너무 길어 제목 속성을 모두 표시할 수 없는 경우 이 속성을 사용하여 이미지 설명이 포함된 문서의 URL을 가리킵니다.
lowsrc=url	e4+/N2+. 이미지가 큰 경우 브라우저에 표시되는 데 시간이 걸릴 수 있습니다. 이미지가 네트워크를 통해 전송되는 동안 lowsrc 속성을 사용하여 썸네일을 지정하면 브라우저에 먼저 표시되고 원본 이미지가 전송된 후 썸네일이 자동으로 교체됩니다.
suppress=suppress	N4+. 억제한다는 것은 억제한다는 뜻이다. 기본값은 false입니다. true로 설정하면 이미지 전송 중 이미지 위치에 표시되어야 하는 작은 아이콘이 도구 설명(프롬프트 상자)으로 대체됩니다.
vspace=n	H3-H4T/e2+/N2+. 이미지 주위의 수직 공간을 설정합니다.
name=name	H4/e4+/N3+. 이름을 지정하세요.

【클릭 가능한 필드 관련 속성】

Attributes	meaning
ismap	H2+/e2+/N2+. 이미지를 서버측 이미지 맵으로 지정합니다.
usemap=usemap	H3+/e2+/N2+. 이미지를 클라이언트 이미지 맵으로 지정합니다. <지도>를 참고하세요.

【동영상 관련 속성】

속성	의미
컨트롤	e2-e3. 비디오 아래에 재생 컨트롤을 표시합니다. IE4.0에서는 더 이상 사용되지 않습니다.
dynsrc=url	e2+. 비디오 파일(*.avi)을 지정합니다. 이미 및
loop=n	e2+. 플레이 시간을 설정하세요. loop=infinite인 경우 무한 루프로 재생됩니다.
start=start	e2+. fileopen으로 설정하면 웹페이지가 열리자마자 재생됩니다. mouseover로 설정하면 마우스를 올려놓으면 동영상이 재생되기 시작합니다.

【데이터 바인딩 관련 속성】

Attributes	의미
datafld= datafld	e4+. 데이터 바인딩을 위한 데이터 소스의 컬럼 이름을 지정합니다.
datasrc=datasrc	e4+. 데이터를 바인딩할 때 데이터 소스의 ID를 지정합니다.

【일반 속성】

속성	은
class을 의미합니다. =class	H4+ /e3+/N4+. 클래스를 지정합니다.
id=id	H4+/e3+/N4+. 아이디를 지정하세요.
style=style	H4+/e3+/N4+. 스타일을 지정합니다.
title=title	H4+/e4+/N6+. 제목을 지정하세요.
dir=dir	H4+/e5+/N6+. 텍스트가 표시되는 방향을 지정합니다.
lang=lang	H4+/e4+/N6+. 언어 유형을 지정합니다.
accesskey=key	H5+. 바로가기 키를 할당합니다.
tabindex=n	H5+. 컨트롤에서 TAB 키가 이동하는 순서를 지정합니다.
contenteditable=bool	H5+/e55+. 요소를 편집 가능하게 만듭니다.
contextmenu=id	H5+. 컨텍스트 메뉴를 지정합니다.
draggable=bool	H5+. 드래그 가능.
dropzone=value	H5+. 드래그 앤 드롭이 가능합니다.
숨겨짐	H5+. 숨겨진 요소.
spellcheck=bool	H5+. 철자를 확인하세요.
IE 확장 속성	IE 확장 속성을 지정할 수 있습니다.

Example

HTML code

<img src="image/kanami.jpg" alt="举例图片" width=100 height=100>

로그인 후 복사

요약: 위 내용은 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되기를 바랍니다.