1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | <!DOCTYPE html> <html> <head> <title>이미지 맵 만들기 예제</title> </head> <body> <br> <p> <img src="deadpool.png" width="150" height="150" border="0" alt="데드풀" usemap="#ImageMap"> <map name="ImageMap"> <area shape="rect" coords="0,150,75,0" href="http://www.daeguoracle.com/" alt="예담"> <area shape="rect" coords="75,150,150,0" href="http://www.naver.com/" alt="네이버"> </map> </p> </body> </html> | cs |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 | <!DOCTYPE html> <html> <head> <title>이미지 맵 만들기 예제</title> </head> <body> <br> <p> <img src="BlackPantherFace.jpg" width="300" height="300" border="0" alt="블랙 팬서" usemap="#ImageMap"> <map name="ImageMap"> <area shape="rect" coords="0,300,150,0" href="http://www.daeguoracle.com/" alt="예담"> <area shape="rect" coords="300,300,150,0" href="http://www.naver.com/" alt="네이버"> </map> </p> <p> <img src="deadpool.png" width="300" height="300" border="0" alt="데드풀" usemap="#ImageMap2"> <map name="ImageMap2"> <area shape="circle" coords="80,155,15" href="http://www.daeguoracle.com/" alt="예담"> <area shape="circle" coords="220,155,15" href="http://www.naver.com/" alt="네이버"> </map> </p> </body> </html> | cs |
'스마트웹&콘텐츠 개발자 과정 > HTML, CSS, JavaScript' 카테고리의 다른 글
| 화면 구현 2번째 시간 (0) | 2018.06.05 |
|---|---|
| 웹 화면 구현 수업 첫 시간 (0) | 2018.06.04 |