自WEB推出服务器模式后,web从未熄火,本文为新入门小白总结。
开发WEB应用前端,HTML+CSS+JS。
平台:myeclipse。
编写html文件的软件:sublime text3。
HTML,一堆文本标签,但以一个网页的经验来看,大部分都是通过div+css的属性构造出大块的框架后,进行编写css类。在实践中获取的经验,通过开发者工具直接修改属性,可以方便观看修改后的结果。
html的结构大致为:
<!DOCTYPE html>
<html>
<head>
<styletype=”text/css”></style>
<script></script>
<head>
<body>
<div class=”xxx”></div>
</body>
</html>
在head中style定义需要的css样式,通用的情况下可以放入外部文件*.css。
script中定义需要的js函数,浏览器默认为javascript,构造动态的网页。*.js。
html比较容易,重要的是理解各个标签所包含的css属性。
css也可以包含几个动态的效果,如hover就是鼠标移动到上面之后,更改表现的属性,如:
.head-nav:hover{
text-decoration:none;
color:#ff9d00;
height:65px;
border-bottom:3px solid #ff9d00;
}
代表class=”head-nav”的元素的hover事件,更复杂的事件(触发、激发)应该由js来处理。
JavaScript
js也比较容易,但要注意var声明后的变量是局部变量,在块{}内为他的生命周期,而任意位置的不声明变量都是全局变量,直到网页关闭为止。
js中比较重要的是jQuery,他的一个库,可以在微软和谷歌在线获取,或者是下载后访问服务器获取,如果在线获取有一个好处是一般服务器内都有缓存,可以提高速度,不必从服务器中读取。
jQuery的作用就是快速生成十分牛逼的动画效果,真的是非常容易学习,但没有艺术家头脑还是不行,谁能想到进度条竟然是背景图片加solid的一个颜色,可以通过控制颜色占父块宽度的百分比来控制进度,可能我天生没有艺术细胞吧。透明度缓缓变化,翻来覆去的界面效果,jQuery都可以实现,稍后进行学习HTML5,youtube中的播放视频部分采用html5的新标签。
$(document).ready(function(){
$("#nav-ulli").click(function()
{
$("#main-img").animate({opacity:0.4},200,function(){$("#main-img").attr('src','./res/site3.jpeg').animate({opacity: 1}), 200});
$(this).attr("class","active");
});
$("button").click(function()
{
$("p").hide();
});
});
会制作网页后,总想看看别人的优秀界面是怎么做的,只要点击审查元素,基本就能了解个大概布局,console中也包含各个公司的hr邮箱。前端让生活更精彩。
JS无法快速地进行科学运算,更好的是用python,但你可以通过js控制所有访问的浏览器进行分布式运算。
广为人知的json也是js中表示数据的方法:
var person={firstname:"Bill", lastname:"Gates", id:5566};
我们可以通过person[firstname]得到Bill,很像是python中的字典,C++中的map,但他表示简单,在网络中省流量,广为流传。
还有值得注意的地方就是JS中的数据类型和逻辑运算比较诡异
x==”5”是true,但x===”5”是false。单引号,双引号均可,脚本都这样吗?
另,语句需要分号;
具体的学习还是要在各个网站或是书上学习,有些事不写出来不痛快,23:30,码农的深夜时间,
自WEB推出服务器模式后,web从未熄火。
开发WEB应用前端,HTML+CSS+JS。
平台:myeclipse。
编写html文件的软件:sublime text3。
HTML,一堆文本标签,但以一个网页的经验来看,大部分都是通过div+css的属性构造出大块的框架后,进行编写css类。在实践中获取的经验,通过开发者工具直接修改属性,可以方便观看修改后的结果。
html的结构大致为:
<!DOCTYPE html>
<html>
<head>
<styletype=”text/css”></style>
<script></script>
<head>
<body>
<div class=”xxx”></div>
</body>
</html>
在head中style定义需要的css样式,通用的情况下可以放入外部文件*.css。
script中定义需要的js函数,浏览器默认为javascript,构造动态的网页。*.js。
html比较容易,重要的是理解各个标签所包含的css属性。
css也可以包含几个动态的效果,如hover就是鼠标移动到上面之后,更改表现的属性,如:
.head-nav:hover{
text-decoration:none;
color:#ff9d00;
height:65px;
border-bottom:3px solid #ff9d00;
}
代表class=”head-nav”的元素的hover事件,更复杂的事件(触发、激发)应该由js来处理。
JavaScript
js也比较容易,但要注意var声明后的变量是局部变量,在块{}内为他的生命周期,而任意位置的不声明变量都是全局变量,直到网页关闭为止。
js中比较重要的是jQuery,他的一个库,可以在微软和谷歌在线获取,或者是下载后访问服务器获取,如果在线获取有一个好处是一般服务器内都有缓存,可以提高速度,不必从服务器中读取。
jQuery的作用就是快速生成十分牛逼的动画效果,真的是非常容易学习,但没有艺术家头脑还是不行,谁能想到进度条竟然是背景图片加solid的一个颜色,可以通过控制颜色占父块宽度的百分比来控制进度,可能我天生没有艺术细胞吧。透明度缓缓变化,翻来覆去的界面效果,jQuery都可以实现,稍后进行学习HTML5,youtube中的播放视频部分采用html5的新标签。
$(document).ready(function(){
$("#nav-ulli").click(function()
{
$("#main-img").animate({opacity:0.4},200,function(){$("#main-img").attr('src','./res/site3.jpeg').animate({opacity: 1}), 200});
$(this).attr("class","active");
});
$("button").click(function()
{
$("p").hide();
});
});
会制作网页后,总想看看别人的优秀界面是怎么做的,只要点击审查元素,基本就能了解个大概布局,console中也包含各个公司的hr邮箱。前端让生活更精彩。
JS无法快速地进行科学运算,更好的是用python,但你可以通过js控制所有访问的浏览器进行分布式运算。
广为人知的json也是js中表示数据的方法:
var person={firstname:"Bill", lastname:"Gates", id:5566};
我们可以通过person[firstname]得到Bill,很像是python中的字典,C++中的map,但他表示简单,在网络中省流量,广为流传。
还有值得注意的地方就是JS中的数据类型和逻辑运算比较诡异
x==”5”是true,但x===”5”是false。单引号,双引号均可,脚本都这样吗?
另,语句需要分号;
具体的学习还是要在各个网站或是书上学习,有些事不写出来不痛快,23:30,码农的深夜时间,