制作一个简单的时间表

今天，我们来学习如何制作一个简单的时间表吧！

一.首先是布局，我们可以通过设置CSS来对时间表进行设定内容、布局。

在外部设置一个div标签将其他标签包裹起来，就等于是将需要的东西都放进盒子里面。在这里，div标签中放置了span标签（由于span标签是行内标签，因此我们可以在其后面放一个换行标签）和button（按钮）标签。

并且，为了让其好看些许，我们可通过类选择器来选择到需要设置样式的标签进行操作。而这里，我们只需设置div标签的CSS样式即可。

text-alian属性设置的是水平居中，line-height则是内容的行高距离。

然后将写好的代码在浏览器中打开，便可得到下图：

如此，我们的布局便算是完成啦！

二.布局完成之后，就让我们一起来实现它的功能吧！

1.声明变量，获取到HTML中的标签；

2.在onload事件中创建函数、创建日期对象，获取年、月、日、时、分、秒；

3.考虑到0-9是个位数的情况，因此，需要在其前面加上“0”；

4.由于是设置了两个button标签，因此我们还需要为其添加点击事件，

并且在点击事件中为“开始”设置定时器、为“停止”设置停止时间表的功能且添加返回值。

5.点击“开始按钮”之后会执行JS的功能，所以还需要将span标签中的文本用JS重写。可以在“showTime”中写入代码

 然后，在浏览器中打开写好的代码，移动鼠标点击“开始”按钮，时间表显示当前电脑时间，再点击“停止”按钮则会停止。

到这里，一个简单的时间表功能便完成了！

                                                                                           Ps：初来乍到，请多多指教，大神勿喷