前台技术学习
前言：假如我们把src理解为web 服务器的后台，那么WebRoot就为web服务器的前台。Src里面主要是.java类，包括一般的类与servlet类。
前台主要是让用户通过浏览器去浏览所用。后台主要是管理员处理业务逻辑所用。
一、HTML 与CSS介绍
- Html是什么
标记性语言，解释用的。
新建html，basic的。
- 框架介绍
Top.html bottom.html left.html main.html right.html
(Frame)
<body>
这里是index.html
</body>
如果是frameset的话，就不需要body了。
代码如下：（百分比都是可以调整的）
<frameset rows="15%,70%,15%" cols="*" border="0">
<frame src="top.html" name="topFrame" srcolling="no" marginwidth="0" marginheight="0"/>
<frameset rows="*" cols="20%,80%" border="0">
<frame src="left.html" name="leftFrame" srcolling="no" marginwidth="0" marginheight="0"/>
<frame src="welcome.html" name="mainFrame" srcolling="no" marginwidth="0" marginheight="0"/>
</frameset>
<frame src="bottom.html" name="bottomFrame" srcolling="no" marginwidth="0" marginheight="0"/>
</frameset>
- 如何重新部署服务器
- 点击
第一个
然后add ，如果有tomcat服务器的话，直接部署就可以了。
- 关闭服务器以后，如果需要重新启动，点击上面第二个图标，点击打开服务器， tomcat6.0 --- start 即可。
- 有没有成功看console即可，会有提示。
第一个
常见的错误：
错误：
解决办法：left没有资源，出现404错误。
我们在搞框架的时候，frameset 可以理解为tr 行，frame可以理解为td列，一行里面有多个列是允许的。
而且，我们在写src的时候，系统默认会从你的文件夹下面寻找资源，所以，最好是先把html（jsp）名写好，然后粘贴过来即可。
小技巧：
如何去掉框架里面的线：将 border="1"改为 border = "0"即可
框架里面假如没有全部显示的话，我们可以设置下frameset里面的 rows =" 15%,14% ,xxxx" ;修改比例。
4、CSS介绍
1）css是什么
Html5 + CSS3 很炫
Css 样式表，对页面进行美化
2）css格式
选择符、属性、属性值
格式： 选择符{属性：属性值}
1、标记选择器 body table等 对html里面的标记进行风格化
2、类选择器 以 . 开头， .类名称{属性：属性值}
3、ID选择器
4、格式： 以 # 开头， #ID名称{属性：属性值}
3）CSS主要有两种模式：内嵌式与外嵌式
一个界面后台不变，变得大多数是样式。
CSS 有内嵌式，写在html前面的style里面。
<style>
a{
Font-size:30px
}
.one
{
Font-size:30px;
Color: red;
Font-Family:隶书；
}
.two
{
Font-size:30px;
Color: red;
Font-Family:隶书；
}
.three
{
Font-size:30px;
Color: red;
Font-Family:隶书；
}
#first
{
Color:red;
}
#secoed
{
Color:blue;
}
</style>
最好用外嵌式，可以直接引用即可。
<link rel = "sytlesheet" type="text/css" href="css/day4.css" />
Rel为指向
二、JavaScript 介绍
1、基本语法：区分大小写，变量类型不分，统一var . 每个语句结尾可以省略分号。这里的可以，可以理解为可以加也可以不加。
2、关键字: break,case,do,else,for,if,function,retrun,while,catch,continue,default,delete
3、变量声明: 同C++
控制语句： if if else switch
Alert 弹出一个对话框
4、在html或者jsp当中嵌入js
嵌入JavaScript
<script type="text/javascript">
function logincheck()
{
alert("我出来了")
}
</script>
对于JavaScript语句，结尾千万不能有；分号，不然会报错，而且错一个全盘错。（这句话有问题。。。）
<script type="text/javascript">
function logincheck() {
var userName = document.login.userName.value //这玩意需要一层层往下剥离，其中 document是整个文档对象，login是form的name，userName是text文本框
的name; .value 是获取文本框你输入的值。
var password = document.login.password.value
if (userName == "") {
alert("用户名不能为空")
return false
} else if (password == "") {
alert("密码不能为空")
return false
}
alert("我出来了"+userName + password)
}
这个小例子也说明了，返回值假如为空 或者 null都是不行的。只有false才可以。
这个就叫做脚本语言，其实脚本语句JavaScript是最简单的一种，做用户密码验证比较合适 。其实，内嵌java语言，就是jsp语言也是脚本语言。Jquery也是脚本语言。
还有就是，我们在做页面的时候，要验证肯定是在提交的时候验证。我们需要添加单击事件。
<input type="submit" value="保存" name="btn"
onclick="return logincheck();">
函数中有返回的话，就直接用return 函数();即可。
5、常见错误：
Js的常见错误：
- 函数名写错 将alert放在第一行，看看能不能弹出
- 变量名写错 将alert一行一行的往下移，看看能不能弹出对话框
页面需要实时的刷新并保存。
Web常见的错误：
1、未启动tomcat 无法显示网页 ， 就是一张白皮
2、404问题 请求的资源不存在 ， 查看url 是否正确（统一资源定位器 URL） 协议+IP+文件路径
Html登录界面，可以找别人的模板。
