发表于: 2018-09-03 20:42:24

5 680


今天完成的事情:

将任务七的三个页面做出来,并实现跳转

                        

明天计划的事情:

完善任务七

1.结果页面的完善(底部透明按钮)

2.穿插背景音乐      

                

遇到的问题:

1.修改了上次的任务六,将下拉列表的宽度改至不会出现下部的滑动条,认识了一个新的属性:min-width

2.在做任务七页面1和页面2联系的时候就需要单击能跳转到页面二,在网上查到了一种写法

<div onclick="window.open('地址')"></div>(产生一个新的窗口)

<div onclick="window.open('地址') "_self"></div>(在当前窗口)

3.在做页面2底部时,由于宽度的不确定,不知道怎么将div居中

以往做的居中都是在知道宽度的情况下做的,这次不知道宽度

首先尝试了在父元素中设置text-align:center,不能达到目的

尝试了网上的一些复杂的方法也不行

后来将margin-left和margin-right都设置成auto就可以了

4.想在页面2做一个单击之后产生一个确认框

但是在网上看到的都是用JavaScript做的,实在看不懂

                    
收获:

1.min-width 属性设置元素的最小宽度

eg:

<div style="width:100%; height:20px; background:#f00; min-width:800px;"></div>
这个div是全屏的,浏览器不会产生滚动条,但是你把浏览器宽度缩小到800像素的时候,这个div不会再缩小,而浏览器就会产生滚动条

2.

onclick 属性由元素上的鼠标点击触发。

ps:onclick 属性不适用以下元素:<base>、<bdo>、<br>、<head>、<html>、<iframe>、<meta>、<param>、<script>、<style> 或 <title>。

HTML事件属性

http://www.w3school.com.cn/tags/html_ref_eventattributes.asp

3.鼠标悬停之后出现东西

eg:

<div class="father"

  <div class="brother-showing">      

     ....  

   <div>  

 <div class="element">      

 .....  

 </div>

</div>

.element

{   

display:none;

}

.father:hover .element

{   

display:block;

}



在网页中,希望通过单击等其他操作产生一些新的反应,都是要通过JavaScript才能做到,想知道现在我是不是该开始看JavaScript的内容了


返回列表 返回列表
评论

    分享到