HTML은 img 태그를 사용하여 이미지를 생성합니다.-CSS 튜토리얼-php.cn

收藏的图片

집

웹 프론트엔드

CSS 튜토리얼

HTML은 img 태그를 사용하여 이미지를 생성합니다.

php中世界最好的语言

Mar 08, 2018 pm 05:12 PM

html 상표

이번에는 HTML에서 img 태그를 사용하여 이미지를 생성하는 방법을 소개하겠습니다. HTML에서 img 태그를 사용하여 이미지를 생성할 때 주의사항은 무엇인가요?

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>HTML:基础img标签 做一个图库</title>
</head>
<body>
 <h1 id="收藏的图片">收藏的图片</h1>
 <img  src="/static/imghw/default1.png"  data-src="1.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="2.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="3.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="4.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="5.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="6.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="7.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="8.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="9.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="10.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="11.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="12.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="13.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="14.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="15.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
 <img  src="/static/imghw/default1.png"  data-src="16.jpg"  class="lazy"      style="max-width:90%"  style="max-width:90%" alt="HTML은 img 태그를 사용하여 이미지를 생성합니다." >
</body>

로그인 후 복사

HTML은 img 태그를 사용하여 이미지를 생성합니다.

</html>
// 源码讲解
src:图片的路径
width:设置图片的宽度
height:设置图片的高度
alt:图片无法显示则显示描述文字（图库例子中并没有用这个属性）
关于路径分为相对路径和绝对路径
 但有盘符的就是绝对路径 比如:file:///C:/Users/windows/Desktop/html/index.html(我的文件放到了桌面html文件夹的地方)

로그인 후 복사

이 기사의 사례를 읽으신 후 방법을 마스터하셨다고 믿습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!