C/s,B/s架构
C/s架构:C代表客户端,s代表服务器 是桌面应用程序如qq,lol
特点
1. 试用期必须安装
2. 不能跨平台
3. 软件更新时客户端和服务端都得更新
4. 软件采用的是自由协议,比较安全
B/s架构:B:浏览器,s:服务器 网站
特点
1. 使用前不需要安装,使用浏览器通过网址进行访问
2. 能过跨平台
3. 软件更新时,客户端不需要更新
4. 采用通用的HTTP协议,相对来说不安全
HTML头部
HTML是超文本标记语言 Hyper Text Markup Language
HTML不是标记语言,而是一种标记语言,像XML
标记语言是一套标记标签
网页文档的头部:包含了文档的元数据
meta是HTML中的元标签,对应了HTML的相关信息,客户端浏览器会根据这些信息进行处理
作用:搜索引擎优化
定义页面使用语言,自动刷新并指向新的页面,为网站添加关键词、描述内容、作者。
<!--定义网站的搜索关键字(重要)--->
<meta name="keywords" content="HTML,CSS,CS,JQUERY" />
<!--对网站的一个简单概述(重要)-->
<meta name="description" content="前端技术开发" />
<!----作者--->
<meta name="author" content="jiaoke" />
link标签
Link标签定义了文档与外部资源之间的关系
Link标签通常用于链接到样式表
<link rel="stylesheet" type="text/css" href="../css/index.css"/>
style
定义网页的内部样式style,放在头部
script
引用外部的JS文件
HTML基本标签
标题
HTML是超文本标记语言,Hyper Text Markup Language
HTML不是编程语言,而是标记语言。
标记语言就是一套标记标签 Markup tag
HTML使用标记标签来描述网页、HTML文档包含了HTML标签及文本内容
HTML文档也叫Web页面。
h1标题只能在一个网页中出现一次,前提是外面没有Hgroup标签
段落
link链接
title:定义元素的替换文本
target:属性
_blank:在新窗口中打开链接文档
_parent:在父框架集中打开被链接文档
_top:在整个窗口中打开被链接文档
值 在相同
<!--指向万维网上页面的链接-->
<a href="http://www.baidu.com" target="_blank" title="百度">百度一下</a>
<a href="http://www.souhu.com" target="_self">搜狐</a>
<!----在本网页的谋克区域显示另外的网页----
frameborder:是否显示边框,默认显示边框 0代表不显示,1代表显示
---->
`->
list列表
有序列表ol
ol>li
无序列表
ul>li
自定义列表
dl>dt>dd
图像
height与width属性用于设置图像的高度和宽度
alt属性用来为图像定义一串预备可以替换的文本
src:图片路径
title:鼠标梵高图片上,提示文本
<img src="../image/logo.jpg" width="409" height="200" alt="加载失败" title="百度图片"/>
other
HTML区块
1.块级元素:以新行来开始和结束
实例:h1 p ul table
2.内联元素:不会以新行开始
实例:b td a img
div元素:块级元素 可用于组合其他HTML元素的容器 div+css文档布局,独占一行
span元素:内联元素:用作文本的容器
HTML表格
HTML表结构:从语义结构上划分表格为:表头、表主体、表尾
caption:表格的标题
thead标签标识表格头部元素
tbody标签标识表格表体元素
tfoot标签标识表格表尾部分
cellpadding:表格中内容和单元格之间的距离
cellspacing:表格中单元格和单元格之间的距离
在默认情况下,如果不设置表格的边界,表格不显示边界的,可以用border属性设置表格边框
<table border="1">
<!-----表格的标题------->
<caption><h2>学生成绩表</h2></caption>
<tr>
<!---表格的表头使用th定义-------->
<th>学号</th>
<th>高数</th>
<th>语文</th>
<th>政治</th>
</tr>
<tr>
<td>1001</td>
<td>90</td>
<td>15</td>
<td>20</td>
</tr>
table,th,td{
border-collapse:collapse;/*--表示边框合并到一起-->*/
}
colspan:跨列(合并列)
rowspan:跨行(合并行)