发表于: 2019-03-18 22:52:06

1 928


今天完成的事情: 完成了任务十四十五。修改了其中bug。
明天计划的
遇到的问题:暂无
收获:对less跟加熟悉,以及样式表的拆分,文件分类整理。


修改bug

1、导航栏下划线太短,应超出文字宽度。

解决方案:增加左右padding值;并为导航栏任然对齐,应使整个菜单盒子右margin为负值。

2、轮播图中的圆点太大,且在320px时,明显不居中。

解决方案:改变圆点的width和height;并将圆点的原来的右margin全部去掉,只在中间的圆点设置左右margin,即保证间隙,又保证整体居中。

3、首页部分内容,在缩小时,内容与屏幕没有间距。

解决方案:原因是continue和row在575px下,就铺满了整个屏幕,所以,为不改变大屏幕时的布局,又解决现在问题,采用媒体查询@media的方法,让row在575px下margin不为负值

4、相关公司页面,图片土豆logo,自适应下,会在某px下溢出。

解决方案:设置图片最大值。

5、职业介绍页面,在320px下,内容溢出。

解决方案:在会溢出的盒子,添加overflow:hidden。


样式变的拆分:


文件分类整体


学习部分js内容:

JavaScript 是 Web 的编程语言。

                 是互联网上最流行的脚本语言

                 是一种轻量级的编程语言。

                 是可插入 HTML 页面的编程代码。

                        插入 HTML 页面后,可由所有的现代浏览器执行。


HTML 中的脚本必须位于 <script> 与 </script> 标签之间。

脚本可被放置在 HTML 页面的 <body> 和 <head> 部分中。


例子1:显示时间:

function displayDate(){

document.getElementById("id命名").innerHTML=Date();

}


function displayDate 脚本名字:功能-显示时间

document.getElementById固定用法,识别,查找。

("id命名")为body中元素id命名

.innerHTML=Date();暂时不知


可以与button联系在一起使用,

<button type="button" onclick="displayDate()">显示日期</button>

type="button"代表button的类型

onclick当鼠标点击元素使,运行什么

onclick="displayDate()"当鼠标点击,运行displayDate()


联系在一起:

      点击button容器的内容,运行脚本为displayDate()。脚本displayDate()运行,搜素元素“id命名”,执行.innerHTML=Date()功能

document.getElementById("需要查找的元素"); //查找元素

.innerHTML="需要变更的内容"; //改变内容


例子2

<script>

function changeImage()

{

element=document.getElementById('myimage')

if (element.src.match("bulbon"))

{

element.src="/images/pic_bulboff.gif";

}

else

{

element.src="/images/pic_bulbon.gif";

}

}

</script>

<img id="myimage" onclick="changeImage()" src="/images/pic_bulboff.gif" width="100" height="180">


Img有点击效果(onclick),当点击img,运行"changeImage()"脚本。

脚本在<script></script>里。

找到function changeImage()运行{}里内容。

{ element=document.getElementById('myimage') 元素=查找myimage

If (element.src.match("bulbon")) 如果在元素里的src中搜索字符(.match)找到bulbon。

}

element.src="/images/pic_bulboff.gif",则元素的src链接换为。。。



else 否则换为。。。。

变量var

Nan非数

警告框alert(“”)

||代表两边的值

=赋值

==判断值是否相等

===是否完全相等操作

||

2.1只要有一个条件为true时,结果就为true;

2.2当两个条件都为false时,结果才为false;

2.3当一个条件为true时,后面的条件不再判断

1.&&

1.1两边条件都为true时,结果才为true;

1.2如果有一个为false,结果就为false;

1.3当第一个条件为false时,就不再判断后面的条件



返回列表 返回列表
评论

    分享到