HTML 기본 튜토리얼 이미지 마크업

이미지 태그

참고: 이는 일방적인 태그입니다

웹 페이지의 사진은 어디에서나 찾을 수 있습니다

기본적으로 모든 웹페이지에는 사진이 있습니다

다음으로 <img>를 사용하여 웹페이지에 사진을 추가해 보겠습니다.

구문 형식: <img 속성 = "값">
공통 속성

너비: 사진 너비
높이: 사진 높이
테두리 : 그림 테두리의 두께입니다.
Src: 이미지의 경로(상대 경로)
Align: 이미지의 가로 정렬, 값: 왼쪽, 가운데, right
Hspace : 그림과 좌우 텍스트 사이의 거리 (가로 거리)
Vspace : 그림과 텍스트 사이의 거리 상황별 텍스트(수직 거리)).

메모

이미지 크기를 조정하고 싶다면 비례적으로 너비나 높이만 지정하면 됩니다.
Align 속성은 이미지만 중앙에 배치할 수 없고 텍스트만 중앙 정렬할 수 있습니다.
정렬을 사용하면 "그래픽과 텍스트가 혼합된" 효과를 얻을 수 있습니다. align = “left | right”
예를 살펴보겠습니다.

<!DOCTYPE HTML>
<html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
 </head>
 <body>
 <p>Life was like a box of chocolates, you never know what you're gonna get.（生命就像一盒巧克力，结果往往出人意料。）---《阿甘正传》 
 </p>
 <img src="/upload/course/000/000/009/58117bf7d1215384.jpg" width="200" border="5" align="center">
 </body>
</html>

참고: 다른 속성을 입력해 볼 수도 있습니다. 효과를 참조하세요. 이미지를 중앙에 배치하려면 CSS만 사용할 수 있습니다. 나중에 소개하겠습니다

지속적인 학습

새로운 파일

<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> </head> <body> <p>Life was like a box of chocolates, you never know what you're gonna get.（生命就像一盒巧克力，结果往往出人意料。）---《阿甘正传》 </p> <img src="/upload/course/000/000/009/58117bf7d1215384.jpg" width="200" border="5" align="center"> </body> </html>

코드 재설정

자동운전

제출하다

시사 Clear