'HTML 이미지 삽입 태그'에 해당되는 글 1건

  1. 2018.03.10 HTML 이미지 삽입 태그 (<img src ="">)
카테고리 없음2018. 3. 10. 12:17

웹상에서 홈페이지를 멋있게 하거나 또는 가독성을 높이기 위해 이미지의 활용이 무척이나 중요합니다. 오늘은웹 상에서 이미지를 삽입할 때 가장 많이 사용되는 image source 의 약지인<imgsrc="">태그에 대하여 간단하게 소개하고자합니다.

 

1. 비주얼 스튜디오에서 HTML 이미지 삽입 태그 (<img src ="">) 코딩

 

 

 

2..HTML 이미지 삽입 태그 (<img src ="">) 코딩방법 : body 안에서 작성해야 합니다.

 

닫는 태그가 따로 존재하지 않는 태그입니다.:<imgsrc="">

속성(width,height..)과 속성값을 지정하게 되면,이미지의 크기조절이 가능합니다.: <img src="flower.jpg" width="100" height="100">

이미지는 내가 가지고있는 HTML폴더를 기준으로 이미지파일이 동일폴더에 있거나 다른 폴더 또는웹상에 있어도 가져올수있으며, 동영상도 가능합니다.

 

   - HTML과 동일 폴더에 있는 이미지를 가져오는 경우 : <img src="flower1.jpg">

   - HTML의 하위폴더에 있는 이미지를 가져오는 경우 : <img src="images/flower2.jpg"

   - HTML이 있는 폴더의 상위폴더나 다른 폴더에 있는 이미지를 가져오는 경우 <img src="../images/flower3.jpg">

   - 웹상의 이미지를 가져오는 경우 : 웹상의 이미지 특정 주소

이미지를 글씨 왼쪽이나 오른쪽에 위치하게 하는 것도 가능합니다 

----------

 

----------

 

3. 크롬 웹브라우저에서 보이는 이미지 삽인 태그

 

HTML에서 작성한 대로 웹상에 보이게 됩니다. 다만 다른 웹에서 가져온 이미지는 특정 주소를 가져오기 때문에 특정주소가 바뀌게 되면 이미지를 불러오지 못하게 됩니다.

 

 

Posted by csgstar