실습문제 4-7
WEB/TRAINNING 2017. 11. 4. 19:26 |7. <div> 태그를 이용하여 카드의 뒷면을 출력하고, 마우스를 올리면 카드의 앞면이 보이게 HTML 페이지를 작성하라.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 | <!DOCTYPE html> <html> <head> <title>:hover활용</title> <style> div { width : 100px; height : 140px; background-image : url("back.png"); background-size : 100px 140px; } div:hover { background-image : url("spade-7.png"); size : 100px 140px; } </style> </head> <body> <h3>:hover 활용</h3> <hr> <table> <tr><td>마우스를 올리면 카드의 앞면이 보인다.</td> <td><div id="img"></div></td></tr> </table> </body> </html> | cs |