<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>作业</title> <style> *{ margin: 0px; padding: 0px; } div{ margin: auto ; height: 200px; width: 400px; border-radius: 15px; padding: 10px; /*box-sizing: border-box; */ background-color:#2342; box-shadow: 5px 5px 5px #888; background-image: url(7.jpg); background-size: 420px 220px; background-repeat: no-repeat; } .text{ /*text-align: center;*/ color: red; font-size: 20px; line-height: 20px; text-indent: 2em; } h3{ text-align: center; margin-bottom: 20px; line-height: 30px; } </style> </head> <body> <div> <h3 style="color:blue;font-size:20px" onmouseover="change(this)" onmouseout="old(this)" >我是标题</h3> <p>我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落我是一个段落 <br> </p> </div> <script type="text/javascript"> function change(element) { element.style.fontSize = '25px' element.style.color = 'yellow' } function old(element) { element.style.fontSize = '20px' element.style.color = 'blue' } </script> </body> </html>