html常用标记:表格,表单,链接,换行等
换行标签
换段落标签
链接格式为:超链接名称
第1行中的第1列 |
第1行中的第2列 |
第1行中的第3列 |
第2行中的第1列 |
第2行中的第2列 |
第2行中的第3列 |
用户名:
密码:
多行的文本框
css:
1、如何引入一个外部的css文件
2、Css选择器种类
首先说主都有哪些先择器
1.标签选择器(如:body,div,p,ul,li)
2.类选择器(如:class="head",class="head_logo")
3.ID选择器(如:id="name",id="name_txt")
4.全局选择器(如:*号)
5.组合选择器(如:.head .head_logo,注意两选择器用空格键分开)
6.继承选择器(如:div p,注意两选择器用空格键分开)
7.伪类选择器(如:就是链接样式,a元素的伪类,4种不同的状态:link、visited、active、hover。)
在标签内写入style=" "的方式,应该是CSS的一种引入方式,而不是选择器,因为根本就没有用到选择器。
我们分别来看下这些选择器:
1:标签名选择器
一个XHTML文档中有许多标签,例如p标签,h1标签等。若要使文档中的所有p标签都使用同一个CSS样式,就应使用标签选择器。
div {color:red;border:1px blue solid;}
p {color:#000;}
2:类选择器
使用标签选择器可以为整个XHTML文档中的同一个标签指定相同的CSS样式。但是在实际运用中,XHTML文档中的同一个标签会被反复使用。若要为相同的标签赋予不同的CSS样式就应使用类选择器。
测试代码
.test {color:red;border:1px blue solid;}
在html文档里,我们在要控制样式的标签的开标签(非成对标签如input直接放在标签里)里加入 class="xxx",在页面对应的css文件里,用.xxx就可以指向这个标签,从而对这个标签进行控制,我们称这种通过定义类(class)来找到标签的方式为 :类选择器。
这种定义class 的方式是前端开发最常用的选择器,有几个突出的特点:可以给不同的标签设置同一个类,从而用一条CSS命令控制几个标签,减少大量代码,是页面修改简单,易维护,易改版;其次,后台工作人员机会不会用到有关class的相关设置,不需要跟后台人员之间进行交互;再者,可以通过js等动态改变标签的Classname,从而改变整个标签的样式,使前端动态效果实现起来更为容易。
3:ID选择器
ID选择器和类选择器相似,不同的是,ID选择器不能复用。在一个XHTML文档中,一个ID选择器只能把其CSS样式指定给一个标签。
测试代码
#test {color:red;border:1px blue solid;}
有 ID 的 HTML元素可以被JavaScript来操纵.再就是ID也是后台开发人员会经常用的,所以前端开发人员应该尽量少的使用。
4.全局选择器
全局选择器是一个星号。它能作用于XHTML文档中的所有元素。
*{margin:0; padding:0;}
5.组合选择器
标签选择器、类选择器和ID选择器是可以组合起来使用的。一般的组合方式是标签选择器和类选择器组合,标签选择器和ID选择器组合。由于这两种组合方式的原理和效果一样,所以只介绍标签选择器和类选择器的组合。组合选择器只是一种组合形式,并不算是一种真正的选择器,但在实际中经常使用。
比如 .orderlist li {xxxx} 或者 .tableset td {}
我们使用的时候一般用在重复出现并且样式相同的一些标签里,比如 li td dd等。
比如
H1.red {color: red}
群组选择器
.test1,span,test2 {border:1px blue solid;}
div,span,img {border:1px blue solid;}
群组选择器实际上是对CSS的一种简化写法,只不过把有相同定义的不同选择器放在一起,省了很多代码。
6.继承选择器
学习使用继承选择器就必须先了解文档树和CSS的继承。每个XHTML都可以被看作一个文档树,文档树的根部就是html标签,而head和body标签就是其子元素。在head和body里的其他标签就是html标签的孙子元素。整个XHTML就呈现一种祖先和子孙的树状关系。CSS的继承是指子孙元素继承祖先元素的某些属性。以下通过实例来详细讲解这两个重要的CSS概念。
文档树 CSS的继承 继承选择器
.test span img {border:1px blue solid;}
div span img {border:1px blue solid;}
后代选择器实际上是使用:多个选择器加上中间的空格来找到具体的要控制标签;从左往右,依次细化,最后锁定要控制的标签,如上例,先找到class为test的标签,再从他的子标签里查找span标签,再从span的子标签中找到IMG标签。
7.伪类选择器
伪类也是选择器的一种,但是用伪类定义的CSS样式并不是作用在标签上的。伪类作用在标签的状态上。由于很多浏览器支持不同类型的伪类,没有一个统一的标准,所以很多伪类都不常被用到。伪类包括::first-child、:link:、:vistited、:hover、:active、:focus和:lang等等。其中有一组伪类是主流浏览器都支持的,就是超链接的伪类,包括:link:、:vistited、:hover和:active。
a的这四个伪类,分别表示了a的四种状态,要注意的是,a可以只具有一种状态(:link),或者同时具有2种或者三种状态!比如说,任何一个有HREF属性的a标签,在未有任何操作时都已经具备了:link的条件,也就是满足了有链接属性这个条件;如果访问过的a标签,同时会具备 :link :visited 两种状态。把鼠标移到访问过的a标签上的时候,a标签就同时具备了 :link :visited :hover三种状态。
a:link{text-decoration:none;}
javascript:
1、表单元素(文本框、密码框、单选按钮、复选框)等的获取
获取表单中输入的用户名:
var username = document.form.username.value;
var username = document.getElementById("username").value;
username == ""
username.length
checked
2、如何引入一个外部的js文件(test.js)
3、javascript中的对象(window,document,form,location,navigator,history)
4、警告框使用 :alert("用户名不能为空");
servlet:
1、servlet执行的流程 () web.xml
客户端发送请求至服务器
服务器启动并调用Servlet,Servlet根据客户端请求生成响应内容并将其传给服务器
服务器将响应返回客户端
Server创建一个Servlet的实例
Server调用Servlet的init()方法
一个客户端的请求到达Server
Server创建一个请求对象
Server创建一个响应对象
Server激活Servlet的service()方法,传递请求和响应对象作为参数
service()方法获得关于请求对象的信息,处理请求,访问其他资源,获得需要的信息
HelloServlet
包.类名
HelloServlet
/hello
2、如何访问在web.xml配置好的servlet,访问路径
3、servlet生命周期:init(),service(),destroy()
4、servlet请求处理所调用的方法:doGet(),doPost,service() HttpServletRequest,HttpServletResponse
5、如何获取用户提交的请求参数值
String username =request.getParameter("username");
String[] hobbies = request.getParameterValues("hobby");
jsp:
1、jsp执行过程:
jsp先转义,编译,运行
1. 用户请求JSP页面(HTTP请求)
2. web server中的servlet容器发现URL中有JSP后缀, 就调用JSP容器来处理
3. 如果此页面是第一次被请求, JSP容器要定位JSP页面文件并解释它,
解释的过程包括: 将JSP源文件处理成servlet代码(java), 以及编译java文件生成servlet的call文件.
说明: JSP解释器生成的servlet类是实现了java.servlet.jsp.HttpJspPate接口的类(由JSP容器提供)的一个子类, 这个
servlet类叫做页面实现类(JSP页面实例);
4. JSP容器运行页JSP页面实例, 此时servlet(即JSP页面实例)就会出来HTTP请求, 生成对于的HTTP响应并传回给客户端.
如果此页面不是第一次被请求, 则跳过3, 直接跳到4.
2、web应用程序部署,如何访问工程中的jsp文件
3、jsp页面元素:page指令、include指令、jsp声明<%! %>、jsp表达式<%= %>、jsp小脚本<% %>、jsp注释 <%-- %>
4、jsp标准动作:
1)javabean:
、、
2)、
5、jsp中的内置对象、 (9个:request,response,out,session,application,exception,page,config,servlet)
作用域通信对象: (pageContext,request,session,application,pageContext)
6、request、session、application作用范围,如何保存和获取保存在不同范围中的数据。
保存:request.setAttribute("user",user);
获取:User user = (User)request.getAttribute("user");
7、EL表达式,Jsp标签库
<%=((User)request.getAttribute("user")).getUsername() %>
${user.username}
${requestScope.user.username}
条件标签:
循环标签:
${user.username}
GET和POST方法。二者主要区别如下:
1、Get是用来从服务器上获得数据,而Post是用来向服务器上传递数据。
2、 Get将表单中数据的按照variable=value的形式,添加到action所指向的URL后面,并且两者使用“?”连接,而各个变量之间使用 “&”连接;Post是将表单中的数据放在form的数据体中,按照变量和值相对应的方式,传递到action所指向URL。
3、 Get是不安全的,因为在传输过程,数据被放在请求的URL中,而如今现有的很多服务器、代理服务器或者用户代理都会将请求URL记录到日志文件中,然后 放在某个地方,这样就可能会有一些隐私的信息被第三方看到。另外,用户也可以在浏览器上直接看到提交的数据,一些系统内部消息将会一同显示在用户面前。 Post的所有操作对用户来说都是不可见的。
4、Get传输的数据量小,这主要是因为受URL长度限制;而Post可以传输大量的数据,所以在上传文件只能使用Post(当然还有一个原因,将在后面的提到)。
5、Get限制Form表单的数据集的值必须为ASCII字符;而Post支持整个ISO10646字符集。
6、Get是Form的默认方法