Dreamweaver显示时刻教程
亲爱的网友们，大家好！今天我要为大家分享一个实用的小技巧——怎样在Dreamweaver中显示时刻，Dreamweaver是一款非常强大的网页制作软件，而显示时刻功能则可以让你的网页更加生动有趣，下面，就让我来为大家详细介绍一下怎样操作吧！
打开Dreamweaver，创建一个新的网页或者打开一个已有的网页,按照下面内容步骤进行操作：
-
在设计视图中,将光标放置在需要显示时刻的位置。
-
点击插入菜单栏中的“HTML”选项，接着选择“标签”子菜单中的“span”标签，这样,你就可以在网页中插入一个span标签了。
-
在弹出的“标签属性”对话框中，找到“class”属性，并为其添加一个自定义的类名，show-time”,这个类名将在后面的CSS样式中用到。
-
点击“确定”按钮，关闭“标签属性”对话框,你的网页中应该出现了一个空的span标签。
-
我们需要为这个span标签添加时刻显示功能，在HTML代码中，将光标放在span标签内的任意位置,并输入下面内容代码：
<script>function showTime() var now = new Date(); var year = now.getFullYear(); var month = now.getMonth() + 1; var day = now.getDate(); var hour = now.getHours(); var minute = now.getMinutes(); var second = now.getSeconds(); var timeStr = year + "年" + month + "月" + day + "日 " + hour + "时" + minute + "分" + second + "秒"; document.getElementById("show-time").innerHTML = timeStr;}setInterval(showTime, 1000);</script>
-
保存你的网页，并在浏览器中预览，你应该可以看到网页上显示着实时更新的时刻了！
-
为了让时刻显示更加美观，我们可以为这个span标签添加一些CSS样式，在CSS代码中，找到我们之前设置的类名“show-time”,并添加下面内容样式：
.show-time font-size: 24px; color: 333; font-weight: bold;}
保存CSS样式，并在浏览器中刷新网页，你就可以看到带有自定义样式的实时时刻了！
怎么样经过上面的分析步骤，你就可以在Dreamweaver中轻松实现时刻显示功能，希望这篇文章对你有所帮助，希望兄弟们制作出更多杰出的网页！
