JavaWeb
使用Java语言开发基于互联网的项目
B/S架构详解
资源分类
- 静态资源:
使用静态网页开发技术发布的资源
特点:
所有用户访问,得到的结果是一样的
如,文本,图片,音频,视频,HTML,CSS,JavaScript
如果用户请求的是静态资源,那么服务器会直接将静态资源发送给浏览器,浏览器中内置了静态资源的解析引擎,可以展示静态资源 - 动态资源
使用动态网页技术发布的资源
特点
所有用户访问得到的结果可能不一样
如:jsp/servlet,php,asp…
如果用户请求的是动态资源,那么服务器会执行动态资源,转换为静态资源再发送给浏览器
静态资源:
- HTML:用于搭建基础网页,展示页面的内容
- CSS:用于没换页面,布局页面
- JavaScript:控制页面的元素,让页面有一些动态的效果
HTML
概念:最基础的网页开发语言
Hyper Text Markup Language 超文本标记语言
超文本:超文本是用超链接的方法,将各种不同空间的文字信息组织再一起的网状文本
标记语言:由标签构成的语言。<标签名称>
标记语言不是编程语言
快速入门
语法
1.html文档后缀名.html或.htm
2.标签分为
围堵标签:又开始和结束标签,比如
自闭和标签:开始和结束标签在一起,比如
3.标签可以嵌套
需要正确嵌套
4.在开始标签中可以定义属性,属性由键值对构成,值需要用引号(单双都可)引起来
5.html的标签不区分大小写,但是建议小写
标签学习
1.文件标签:构成html最基本的标签
html:html的根标签
head:头标签,用于指定html文档的一些属性,引入外部资源
title:标题标签
body:体标签
2.文本标签:和文本有关的标签
<!-- 注释内容 -->
:注释
<h1>-<h6>
:标题标签,字体大小递减
<p>
:段落标签
<br>
:换行标签
<hr>
:展示水平线并自带换行功能
属性:
*color:颜色
*width:宽度
*height:高度
*align:对齐方式
**center:居中
**left:左对齐
**right:右对齐
<b>
:字体加粗
<i>
:字体斜体
<font>
:字体标签
属性:
*color:颜色
*size:大小
*face:字体
属性定义
*color:
**1.英文单词:red。。。
**2.rgb(值1,2,3):范围0-255
**3.#值123:范围00-FF
*width:
**1.数值,默认单位是px像素
**2.数值%,占比相对于父元素的比例
<center>
:文本居中
图片标签
<img>
:展示图片
*src:制定图片的位置
列表标签
有序列表
*ol
*li
无序列表
*ul
*li
连接标签
<a>
:定义一个超链接
*href:指定访问资源的url
*target:指定打开资源的方式
**_self:默认值,在当前页打开
**_blank:在空白页面打开
div和span
<div>
:每一个div占满一整行,块级标签
<span>
:文本信息在一行展示,行内标签,内联标签
语义化标签
html5中为了提高程序的可读性,提供了一些标签
<header>
:页眉
<footer>
:页脚
表格标签
<table>
:定义表格
*width:宽度
*border:边框
*cellpadding:定义内容和单元格的距离
*cellspacing:定义单元格之间的距离,指定为0单元格的线会合为一条
*bgcolor:背景色
*align:对齐方式
<tr>
:定义行
*bgcolor:背景色
*align:对齐方式
<td>
:定义单元格
*colspan:合并列
*rowspan:合并行
<th>
:定义表头单元格
<caption>
:表格标题
<thead'>
:表格的头部分
<tbody>
:表格的体部分
<tfoot>
:表格的脚部分
表单标签
表单:用于采集用户输入的数据,用于和服务器交互
<form>
:用于定义表单,可以定义一个范围,范围内代表采集用户数据的范围
属性
*action:指定提交数据的URL
*method:指定提交的方式,共7种,两种常用
**get:
***1.请求参数会在地址栏中显示,封装到请求行中
***2.请求参数的大小是有限制的
***3.不太安全
**post:
***1.请求参数不会在地址栏中显示,封装到请求体中
***2.请求参数的大小没有限制
***3.较为安全
表单项中的数据要想被提交,必须指定其name属性
表单项标签
<input>
:可以通过type属性,改变元素展示的样式
type属性:
*text:文本输入框,默认值
**placeholder:指定输入框的提示信息,当输入框内容变化时,会自动清空
*password:密码输入框
*radio:单选框
1.要想让多个单选框实现单选的效果,则多个单选框的name属性必须相同
2.一般给每个单选框提供value属性,指定其被选中后提交的值
3.checked属性可以指定被默认选中
*checkbox:复选框
1.一般给每个复选框提供value属性,指定其被选中后提交的值
2.checked属性可以指定被默认选中
*file:文件选择框
*hidden:隐藏域,用于提交一些信息
按钮:
*submit:提交按钮,用于提交表单
*button:普通按钮
*image:图片提交按钮,用src指定图片路径
<label>
:指定输入项的文字描述信息
一般会让label的for属性和input的id属性值对应,如果对应了,点击label处input会获得焦点
<select>
:下拉列表
子元素:
<option>
:指定列表项
<textatea>
:文本域
*cols:指定列数,每一行的字符数
*rows:默认行数