黑马程序员-HTML概述
来源:互联网 发布:2重积分算法 编辑:程序博客网 时间:2024/03/29 16:19
----------- android培训、java培训、java学习型技术博客、期待与您交流! ------------
1 Html 就是超文本标记语言的简写,是最基础的网页语言。
2 Html 是通过标签来定义的语言,代码都是由标签所组成。
3 Html 代码不用区分大小写。
4 Html 代码由<html>开始,</html>结束。 里面由头部分<head></head>和体部分<body></body>两部分组成。
5 头部分是给Html页面增加一些辅助或者属性信息,它里面的内容会最先加载。
6 体部分是真正存放页面数据的地方
<html>
<head>
<tittle> 标题 </tittle>
</head>
<body>
主体
</body>
</html>
字体标签
网页三剑客:
dreamwaver
flash
fireworks
字体标签 <font color="" size=""> </font>
<h6> </h6>
转译尖括号
< <
" "
™ =
> >
& &
空格
列表标签
<dl> 列表范围
<dt> 上层项目条目
<dd> 下层项目条目,具备缩进效果
注释:<!--注释文字-->
数字标签 <ol>
符号标签 <ul>
具体项目内容标签,此标签只在<ol> <ul>中有效 <li>
自带自动缩进
通过type属性更改项目符号,如果想做出效果更好的列表,就用到css。
<ul type="" start="3">
可以更改条目开头的点, 从第三个开始。
图像标签
<img src="" alt="。。。" border=“” >
alt 说明文字
border 边框
align 对齐方式
设计视图:
工具条--设计
图像----热点工具 可以让图像的某一部分链接资源
(图像热点区域,鼠标移动到指定位置会变手势)
表格标签
<table border="1" bordercolor="" width="" cellpadding=“” cellspacing=“”>
//边框,宽度(60%,相对窗口大小),cellpadding文字距四个边框的距离,cellspacing单元格之间的距离
<caption> 表格标题 </caption>
<tr> 代表行
<td> 单元格
<th> 表格信息(居中加粗)
表格的作用就是格式化数据
table
|--tbody
|--tr
|--td
|--th
为了增加表格的下载速度
可以分成三部分
<thead> <tbody> <tfoot>
div+css+table
近期最流行的网页形式
<th colspan="2">
占两列
rowspan="2"
占两行
超链接标签
<a href="http..."> </a>
点击超链接浏览器做的事情
1、启动相对应的协议引擎
2、解析后面的具体内容
3、如果跟的是一个主机地址,先查找本机hosts文件列表,是否可以找到该主机对应ip;
若没有找到,会找本机指定的后者本机默认的DNS服务器,去解析该主机。
4、获取到该ip后,在连接该指定ip 的主机,并获取所需的资源。
注意:
1、当没有指定具体协议时,浏览器会默认file协议引擎来解析href的值
2、当指定协议,浏览器无法解析时,会在本地注册中查找是否有关联该协议的应用程序,并调用。
<a href="mailto:...?subject=hehe&cc=qqq@163.com"> 联系我们 </a>
则主题为hehe
则邮箱为qqq@163.com
超链接标签-定位标记
<a href="#top"> 回到顶部位置 </a>
<a name="haha"> 中间位置 </a>
<a href="#haha"> 回到中间位置 </a>
点击可以到haha的位置~
<a href="javascript:alert('hahahahha')">
一个对话框 </a>
框架
<frameset rows="30%,*" border="0">
<frame src="1.html"/>
<frameset clos="30%,*">
<frame src="3.html" noresize="noresize"/>
<frame src="2.html"/>
</frameset>
</frameset>
点击超链接之后在右侧打开
<a href="1.html" target="right"> 一个连接
</a>
<br/>
noresize 禁止用户调整框架大小
border="0" 隐藏框架
href点击才请求,不点击不请求~
iframe 画中画标签
<iframe src="demo.html">这是画中画标签
</iframe>
表单中的组件
<form>
用户名: <input type="text" value="默认值" /> <br/>
密码: <input type="password"/> <br/>
性别: <input type="radio" name="sex"/> 男 <input type="radio" name="sex" checked="checked"/> 女 <br/>
技术:<input type = "checkbox"/> JAVA <input type = "checkbox" /> HTML
<input type="checkbox" /> css
附件:<input type = "file" /><br/>
<input type="image" src="..." hight="200px" width="300px"> <br/>
<input type = "button" value="我是一个按钮" onclick="javascript:alert('我弹')"/> <br/>
<input type="hidden" name="key" value="haha"/>
<input type = "submit" value="提交数据" />
<input type="reset" value="清除数据" />
<select multiple="multiple" size="3">
(multiple支持多选, size表示一次显示的个数)
<optin>--选择国家--</optin>
<optin>--美国--</optin>
<optin selected="selected">--中国--</optin>
</seltct>
(下拉菜单)
<textarea cols="20" rows="10" > </textarea>
(cols和rows代表行和列)
</form>
radio是单选框
name= 若只能单选 组名要相同
checked 默认被选中
隐藏项虽然客户端看不到,但是会提交到服务端
图片的功能和提交按钮是一样的~
可以做一个漂亮的提交按钮
表单中的组件的name和value属性
表单的组件都需要定义两个属性:name和value
name负责给组件起名 用于区分组件
value是该组件的具体的值
文本框、密码框和文本区域,name必须指定,value可以不用指定,因为文本框录入的文字就是value的值
但是指定value也没有问题,会在文本框或文本区域中默认显示。
表单提交 get和post的区别
<fieldset> (区域标签)
<legend> 我的注册区域 </legend>
<form action="http://127.0.0.1:10009" method="">
(默认当前页面和get)
<table border="1" bordercolor="#0099FF" width="70%" cellpadding="10px" cellspacing="0">
<tr>
<th colspan="2"> 我的注册页面
</th>
<tr>
<tr>
<td>用户名
</td>
<td>
<input type="text" name="psw" />
</td>
</tr>
<tr>
<td>密码
</td>
<td>
<input type = "password" name="repsw" />
</td>
</tr>
<tr>
<td>确认密码
</td>
<td>
</td>
</tr>
<tr>
<td>性别
</td>
<td>
<input type="radio" name="sex" value="nan"/> 男
<input type="radio" name="sex" value="nv"/> 女
</td>
</tr>
<tr>
<td>技术
</td>
<td>
<input type="checkbox" name="tech" value="java" /> JAVA
<input type="checkbox" name="tech" value="html" />HTML
<input type="checkbox" name="tech" value="css" />CSS
</td>
</tr>
<tr>
<td>国家
</td>
<td>
<select name="country" >
<option value="none" > 选择国家 </option>
<option value="usa" > 美国 </option>
<option value="cn" > 中国 </option>
<option value="en" > 英国 </option>
</td>
</tr>
<tr>
<th colspan="2">
<input type="submit" value="提交数据" >
<input type="reset" value="清除数据">
</th>
</tr>
</table>
</form>
</fieldset>
form标签中常见的属性定义:
action:指定表单数据发送的位置,默认提交当前页面
method:定义表单提交的方式,常用的是get和post,默认get提交
提交后url中?后跟的是提交的数据
每个属性由&来做间隔
注册服务器
import java.net.*;
import java.io.*;
class RegServer
{
public static void main(String[] args) throws Exception
{
ServerSocket ss = new ServerSocket(10009);
Socket s = ss.accept();
InputStream in = s.getInputStream();
Byte[] buf = new byte[1024];
int len = in.read(buf);
System.out.println(new String(buf,0,len);
PrintWriter out = new PrintWriter(s.getOutputStream(),true));
out.println("<font color = 'green' size='7'> 注册成功 </font>");
s.close();
ss.close();
}
}
get和post区别
1、get提交的信息显示在地址栏上,而post不会
2、get对于敏感信息不安全,而post较安全,因为不显示在地址栏上
3、地址栏的数据量是有限的,因此get不能提交大数据,而post可以提交大体积的数据
4、get会将信息封装在请求行,也就是http请求消息头之前;而post会将信息封装在请求体,也就是http请求消息头之后。
请求体和请求头之间是通过空行来进行分隔的。
特殊之处:
对于Tomcat服务器,当提交中文时,
get提交:服务端接收到中文数据,会用默认的IOS8859-1解码,会出现乱码,所以必须对该乱码进行一次编码再解码的动作。当向服务端请求时,会将数据封装在一个请求的对象中,request对象,可以通过该对象的String name = getParameter(“user”);获取客户端提交的用户名。 但会出现乱码,所以要用new String (name.getBytes("iso8859-1"),"GBK");
post提交:服务端收到中文,可以使用编一次再解一次的方式,也就是和get一样的方式可以完成乱码的解决。通过它有另一种方式,也就是直接使用request对象,调用一个方法。setCharacterEncoding("GBK"); 只要设置了请求对象中的数据的编码表,那么 String name = request.getParame?ter("user");那么name的值,直接就是解码完毕的正确数据。
注意:因为get只对请求体中的数据进行解码,不对请求头中的数据进行解码,所以不能使用setCharacterEncoding("GBK");这个方法
综上所述:
在进行表单提交时,建议使用post提交。
若需要提交数据,要写form标签。
BS和CS结构
目前开发的基本架构:
1.BS结构:Browser /Server
开发者需要编写两个端点,一个是客户端程序,一个是服务端程序。
例如:QQ、360
需要在客户机上安装客户端的部分
弊端:客户端的维护较为麻烦,机器只要一重装,就需要重新安装该软件,升级也比较麻烦。后期有一个解决方案,对于升级,可以通过网络升级的形式完成。
好处:客户端的出现,可以减轻服务端的运算压力,可以让一部分运算转移到客户端来,而且可以在客户端进行用户的个性化配置信息的存储~
最为常见的是网络游戏,比如传奇,魔兽世界,杀毒软件。
2.CS结构:Client /Server
程序员只需要编写服务端,而客户端只需要有浏览器即可。只要装有操作系统机器都自带浏览器。这是web技术的流行,导致了这种结构的流行。
不用开发客户端,相对省事儿很多,而且操作简单,只要能上网,就可以进行像浏览网页一样进行功能的使用。
运行全在服务端,对于大数据运算,就会很慢~页游是用flash完成的,数据量较小,而且flash也是在客户端由浏览器启动flash解析引擎,再进行解析执行。
等云计算普及后,可以实现分布式计算,所有的运算都交给云端(互联网上的各个服务器)完成,但必须解决掉两个问题:
1、数据的安全性
2、带宽
----------- android培训、java培训、java学习型技术博客、期待与您交流! ------------
- 黑马程序员-HTML概述
- 黑马程序员_Map概述
- 黑马程序员_JavaScript概述
- 黑马程序员-GUI概述
- 黑马程序员-JAVA概述
- 黑马程序员 Java 概述
- 黑马程序员_Java概述
- 黑马程序员-Java 概述
- 黑马程序员-JAVA概述
- 黑马程序员----Java概述
- 黑马程序员 XAML概述
- 《黑马程序员》socket---概述
- 黑马程序员_java概述
- 黑马程序员_01JAVA概述
- 黑马程序员_java概述
- 黑马程序员_java概述
- 黑马程序员_Java概述
- 黑马程序员_java概述
- hdu 2717Catch That Cow 简单的广搜
- 成功驱动5150用HT68F30
- 问题二十七:输入3个学生3门课的成绩,计算每个学生的总分和平均分成绩。(用while循环)
- IOS 在iOS地图上绘制两点间路线
- Android Permission 权限
- 黑马程序员-HTML概述
- 快速幂取模
- 学习总结4.8
- 提高大脑清晰度
- 2013编程之美全国挑战赛-传话游戏
- JavaScript 函数
- android.os.NetworkOnMainThreadException
- VC编程实现:删除一个文本文件中的空行
- 2013编程之美资格赛总结