博客列表 >3月15日作业

3月15日作业

php学习笔记
php学习笔记原创
2018年03月16日 13:19:46725浏览
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>短歌行</title>
<style>
          div{
           text-align: center;       
           width: 250px;
           height: 600px;
           border: 1px solid red;
           background-color: antiquewhite;
           border-radius: 20px;
          }
          .text{
           color: #363636;
           line-height: 2em;
          }
          h3{
           color: red;
           font-size: 20px;
          }
</style>
</head>
<body>
<div>
<h3 onmouseover="change(this)"
onmouseout="old(this)">短歌行</h3>
<p>
<span onmouseover="read(this)" onmouseout="readout(this)">对酒当歌,人生几何!</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">譬如朝露,去日苦多。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">慨当以慷,忧思难忘。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">何以解忧?唯有杜康。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">青青子衿,悠悠我心。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">但为君故,沉吟至今。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">呦呦鹿鸣,食野之苹。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">我有嘉宾,鼓瑟吹笙。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">明明如月,何时可掇?</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">忧从中来,不可断绝。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">越陌度阡,枉用相存。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">契阔谈䜩,心念旧恩。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">月明星稀,乌鹊南飞。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">绕树三匝,何枝可依?</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">山不厌高,海不厌深。</span><br>

<span onmouseover="read(this)" onmouseout="readout(this)">周公吐哺,天下归心。</span><br>
</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'
}
function read(element){
element.style.color = 'blue';
}
function readout(element){
element.style.color = '#363636';
}
</script>
</body>
</html>

运行结果如下图:

结果.png

手抄代码如下图:

1.jpg

2.jpg

3.jpg

声明:本文内容转载自脚本之家,由网友自发贡献,版权归原作者所有,如您发现涉嫌抄袭侵权,请联系admin@php.cn 核实处理。
全部评论
文明上网理性发言,请遵守新闻评论服务协议