<!doctype html> <html> <head> <meta charset="utf-8"> <style type="text/css"> div { width: 300px; height:200px; padding: 15px; border-radius: 15px; box-shadow: 15px 15px 1px #f3f3f3; /*background-color: #efefef;*/ background-image: url(images/ceshi.jpg); background-size: 430px 280px; background-repeat: no-repeat; } .text { color:#363636; text-indent: 2em; line-height: 1.5em; } </style> <div> <h3 style="color:brown;text-align: center;font-size:20px" onmouseover="change(this)" onmouseout="old(this)" >这是一篇文章</h3> <p class="text">从前有个渔夫,每天不停的在海边打鱼,他的名字叫彼得.</p> </div> <script type="text/javascript"> function change(element) { element.style.fontSize = '22px' element.style.color = 'green' } function old(element) { element.style.fontSize = '20px' element.style.color = 'red' } </script>