B/S架构详解:
资源分类:
1.静态资源
使用【静态网页开发技术】发布的资源
特点:
1.所有用户访问,看到的网页一样
2.如:文本,图片,音频,视频,HTML,CSS,JavaScript
3.如果请求的是静态资源,那么服务器会直接将静态资源发送给浏览器。
【浏览器中内置了静态资源的解析引擎】,可以展示静态资源
2.动态资源:
使用【动态网页技术发布的资源】
特点:
1.所有用户访问,得到的结果可能不一样
2.如:JSP/Servlet
3.如果用请求的是动态资源,服务器会去执行动态资源,转换为静态资源,再发送给浏览器
学习动态资源前必须要学习动态资源
静态资源:
HTML:用于搭建基础网页,用于展示网页内容
CSS:用于美化页面,布局页面
JavaScript:控制页面的元素。让页面有动态效果
HTML
概念:
Hyper Text Markup Language 超文本标记语言
最基础的网页开发语言
超文本:
用超链接的方法,将各种不同空间的文字信息组织在一起的网状文本
标记语言:
由标签构成的语言。如html,xml
标记语言不是编程语言
语法:
1.html文档后缀名 .html和.htm
2.标签分为
1.围堵标签:<html></html>
2.自闭合标签:<br/>
3.标签可以嵌套
4.在开始标签中可以定义属性。属性由键值对构成,值需要引号(单双皆可)
5.html标签不区分大小写(建议使用小写)
标签学习:
1.文件标签:构成html【最基本】的标签
html:html文档的根标签
head:头标签。用于指定html文档的一些属性。引入一些外部资源
title:标题标签
body:体标签
<!DOCTYPE html>
2.文本标签:和文本有关的标签
<!-- 注释内容 -->
<h1>~<h6>:标题标签【围堵】
<p>:段落标签【围堵】
<br>:换行【自闭合】
<hr>:显示一条水平线自闭合【自闭合】
<b>:字体加粗【围堵】
<i>:斜体【围堵】
<font>:字体标签【围堵】
3.图片标签:
<img src="文件路径">:【自闭合】
相对路径:
以.开头的路径
./:代表当前目录 ./image/1.jpg
../:代表后退上一级目录
4.列表标签:
有序列表
<ol></ol>:
<li></li>:
无序列表
<ul></ul>:
<li></li>:
5.链接标签:
<a href=""></a>
属性:
href:指定访问资源的URL(统一资源定位符)
6.块标签:
<div></div>:一个标签占满一行,块级标签
<span></span>:文本信息一行展示,行内标签/内联标签
7.语义化标签:html5中为了增加可读性
header【围堵】
footer【围堵】
8.表格标签:
table:定义表格
tr:定义行
td:定义单元格
colspan:合并列(合并左右)
rowspan:合并行(合并上下)
th:定义表头单元格
caption:表格标题
类似语义化标签:
thead:表示表格的头部分
tbody:表示表格的体部分
tfoot:表示表格的脚部分
使用表格标签完成网页布局
1.使用table完成布局
2.如果某一行只有一个单元格,使用tr>td
3.如果某一行有多个单元格,使用tr>td>table
9.表单标签
表单:
概念:用于采集用户输入的数据,用于和服务器进行交互
使用的标签:form
属性:
action:指定提交数据的URL
method:指定提交方式
分类:一共7种,2种最常用
get:
1.请求参数会在地址栏中显示
2.请求参数会封装在请求行中
3.请求参数长度有限制
4.get请求不安全
post:
1.请求参数不会再地址栏中显示
2.请求参数会封装在请求体中
3.请求参数长度没有限制
4.较为安全
注意:表单项中的数据要想被提交,必须指定input标签的name属性
表单项标签:
input:可以通过type属性值,改变元素展示的样式
type属性:
label:指定输入项的文字描述信息
注意:
label的for属性一般和input的id属性值对应,如果点击label区域,则输入框获得焦点
text:文本输入框,默认值
用作提示,一般使用placeholder代替value属性,体验比value好
password:密码输入框
value:指定该属性会显示属性value的值
用作提示,一般使用placeholder代替value属性,体验比value好
radioÿ