课后练习在紧急制作中。。。
Hello，大家好，我是M ，上节课呢，我们已经做到了这个 ，?介绍网站的导航栏 ，?这块位子 ，那么这节课呢我们要解决的就是这一个弹窗的问题了 ，?关于弹窗 ，M在前面的课程就已经给大家讲到过了 ，有一个专门的一个导航的案例，如果大家还有印象的话 ，是做的一个我们虎课网平台的一个导航的一个案例 ，和我们现在的这一个导航呢很像，就是什么呢 ，?我们鼠标移入到一个项目中去之后呢 ，?会弹出一个相对应的一个框 ，?也是我们这个弹窗 ，?那么如果大家 ，?有听过那节课的话 ，?那么我们制作这个弹窗 ，?应该来说是没有什么大的问题的啊 ，好，我们来看一下 ，?首先把DW打开 ，我们可以先 ，?来回顾一下我们前面做了一些东西 ，?首先就是顶部这个，然后就是我们的导航栏 ，?那么我们来看 ，?现在的这个弹窗 ，?我们应该怎么去 ，写它 ，M?给大家分享一下 ，M自己的一个思路啊 ，?首先 ，?这个 ，是一个大的Div ，这个Div就不用说了，对不对 ，?然后呢这个Div里面我们分成两个部分 ，?一个就是上面这里 ，?一个就是下面这个黑色低 ，?那么上面这一块呢 ，?我们再把它分成两个左以及右 ，?首先这个大的我们写死它的宽度之后 ，?我们左边给个50%，然后文字向左居中右边给个50% ，嗯?这边 ，
?文字是向左居中啊 ，?向左对齐，左对齐 ，?然后这边也是50%，然后文字还是左对齐 ，?这样呢 ，这一块我们就OK啦，下面就是一个Div嘛，一个 ，?白字黑底 ，然后字怎么居中呢，文字居中对齐 ，?然后通过行高来控制它 ，?这个就是我们的一个思路 ，?当然，这里可能通过行高，我们 ，不太能控制这个东西，我们可以给一个 ，上上边的一个？？？？？ ，?把文字往下挤 ，?这也是一个方法 ，?那么这个就是我们整个的一个思路，好我们来看一下 ，首先我们来回顾一下我们的CSS ，?这里是顶部的 ，然后从 ，?这里开始 ，?这是我们的导航栏部分了 ，?导航栏部分呢 ，?外面有个大的Div ，?然后里面包了一层UL，这个UL叫Nav ，?然后里面每个Li就是我们的 ，?导航栏的大标题了 ，?弹窗要写在什么写在我们每个Li的里面对不对 ，?我们直接 ，?外面那个大的Div就叫Div弹窗好了 ，?那么这个呢，我们可以 ，?直接在后面写 ，点弹窗 ，?首先外面这个大框它有什么样式呢 ，?就是一个 ，行高嘛对不对 ，?340的390 ，宽 ，?340Px，注意分号 ，高 ，?390px ，
?那么我们还可以加上什么呢 ，我们可以看到这边有个边距对不对 ，?下面也有 ，?左边也有 ，?右边也有，那么其实上面也是有的 ，?那么我们来看一下它这个边距是多少 ，?所以这个边距我们可以给一个什么，内填充也是Padding ，?上下左右所以我们就这么多写一个就是22Px ，好 ，?这个写好了之后呢 ，?我来看一下 ，?刚刚说到的什么 ，?框架，外面一个大的 ，?然后呢 ，里面分成了上和下两个部分 ，好我们再来接着往里面写 ，?上面 ，大家注意看这种 ，?这种命名叫什么，驼峰式命名 ，就是两个单词或者两个词组吧 ，?中间通过大写字母 ，进行一个隔开，驼峰式命名 ，?为什么不直接写Top呢 ，?因为我们前面有个Class叫Top ，看见没有，为了防止我们的代码样式冲突 ，所以呢我们这里叫弹窗Top ，好 ，?刚刚说到的弹窗的Top ，的里面 ，?就是这一块的里面 ，?我们还要分对不对，还要分左和右 ，那么 ，Left以及 ，Right ，?左右嘛 ，?这个是我们上边的一个结构 ，还有下面的 ，Bottom ，?那么我们整个弹窗呢一个Html的结构呢，就已经出来了 ，
?接下来的是什么 ，?慢慢的写 ，?我们先写 ，?上面的样式，也就是这个弹窗Top ，弹窗Top，首先它的宽度 ，?我们可以写100%对不对 ，让它继承它的父级，也就是整个弹窗的这个 ，?高度呢 ，高度呢我们可以怎么样我们可以量 ，?200 ，?200Px ，注意啊为什么从这里量呢，而不是从上面量 ，?是因为什么，是因为上面这是一个Padding对不对，我们刚刚 ，给了弹窗整个外部一个大的一个内填充20像素 ，所以我们从字母这个地方开始量 ，好?宽高好了以后 ，
